Ztree 勾选 checkbox

最新推荐文章于 2024-01-25 12:00:00 发布

转载最新推荐文章于 2024-01-25 12:00:00 发布 · 880 阅读

文章标签：

#前端 ztree

java web 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一个基于jQuery的树形控件zTree插件的使用方法，包括配置选项、创建树形结构、获取选中节点信息、全选/取消全选等功能，并展示了如何通过Ajax动态加载树形数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var setting = {
    check: {
        enable: true
//        chkboxType : { "Y" : "", "N" : "" }
    },
    data: {
        simpleData: {
            enable: true
        }
    }
};

    function createTree () {
        var zNodes;
        $.ajax({
            url: 'Handler.ashx?action=GetModule', //url action是方法的名称
            data: { id: "11" },
            type: 'POST',
            dataType: "text", //可以是text，如果用text，返回的结果为字符串；如果需要json格式的，可是设置为json
            ContentType: "application/json; charset=utf-8",
            success: function (data) {
                zNodes = data;

                $.fn.zTree.init($("#treeDemo"), setting, eval('(' + zNodes + ')'));

            },
            error: function (msg) {
                alert("失败");
            }
        });
    }
    //获取所有选中节点的值
    function GetCheckedAll() {
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
        var nodes = treeObj.getCheckedNodes(true);
        var msg = "name--id--pid\n";
        for (var i = 0; i < nodes.length; i++) {
            msg += nodes[i].name+"--"+nodes[i].id+"--"+nodes[i].pId+"\n";
        }
        $("#msg").val();
        $("#msg").val(msg);
    }

    //全选
    function CheckAllNodes() {
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
        treeObj.checkAllNodes(true);
    }

    //全取消
    function CancelAllNodes() {
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
        treeObj.checkAllNodes(false);
    }

    //选中指定的节点
    function AssignCheck() {
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
//        var nodes = treeObj.getNodes();

treeObj.checkNode(treeObj.getNodeByParam("id", "000100010002", null), true, true);
treeObj.checkNode(treeObj.getNodeByParam("id", "0001000100010001000100010001", null), true, true);

    }
    //禁用、解禁选中节点
    function Disabled1() {
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
        var nodes = treeObj.getCheckedNodes();

        for (var i = 0; i < nodes.length; i++) {
            treeObj.setChkDisabled(nodes[i], true);
        }
    }
    function Disabled2() {
        var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
        var nodes = treeObj.getCheckedNodes();

        for (var i = 0; i < nodes.length; i++) {
            treeObj.setChkDisabled(nodes[i], false);
        }
    }

function Add() {

}
function AddChild() {

}
function Update() {

}
function Delete() {

}
function DeleteAll() {

}

    $(document).ready(function () {
        createTree();
        $("#btn_GetCheckedAll").click(GetCheckedAll);
        $("#btn_CheckAllNodes").click(CheckAllNodes);
        $("#btn_CancelAllNodes").click(CancelAllNodes);
        $("#btn_AssignCheck").click(AssignCheck);
        $("#btn_Disabled1").click(Disabled1);
        $("#btn_Disabled2").click(Disabled2);

        $("#btn_Add").click(Add);
        $("#btn_AddChild").click(AddChild);
        $("#btn_Update").click(Update);
        $("#btn_Delete").click(Delete);
        $("#btn_DeleteAll").click(DeleteAll);


        //$.fn.zTree.init($("#treeDemo"), setting, zNodes);
    });