Ztree的初步使用--checkbox--指定目录下搜索子节点

这里记录一下zTree的check的使用

首先

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Ceshi.aspx.cs" Inherits="EQES.Web.eqes_Questionnaire.Manager.Ceshi" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>无标题页</title>
    <link href="../scripts/zTree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
    <link href="../scripts/zTree/css/demo.css" rel="stylesheet" type="text/css" />

    <script src="../scripts/zTree/js/jquery-1.4.4.min.js" type="text/javascript"></script>

    <script src="../scripts/zTree/js/jquery.ztree.core-3.5.min.js" type="text/javascript"></script>

    <script src="../scripts/zTree/js/jquery.ztree.excheck-3.5.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        <!--
        var setting = {
            check: {
                enable: true
            },
            data: {
                simpleData: {
                    enable: true
                }
            },
            callback: {
                onCheck: zTreeOnClick
            }
        };

        $(document).ready(function() {
　　　　　　　//这里是axjx动态从后台取出数据，取得的是json
            $.post("GetQueRangeTree.ashx", {}, function(data) {
                if (data != "") {
                    //alert(data);这里一定要记住用eval绑定
                    var aa = eval(data)
                    $.fn.zTree.init($("#treeDemo"), setting, aa);
                }
            });
            //$.fn.zTree.init($("#treeDemo"), setting, zNodes);
        });
        //-->
        function zTreeOnClick(event, treeId, treeNode, clickFlag) {
            var treeValue = treeNode.id + "," + treeNode.name;
            alert(treeNode.id + "," + treeNode.name);
        };
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>

        <div class="content_wrap">
            <div class="zTreeDemoBackground left">
                <ul id="treeDemo" class="ztree">
                </ul>
            </div>
            
        </div>
    </div>
    </form>
</body>
</html>

下面介绍一下我的用法，因为我的需求比较特殊，一个子节点有可能在不同的根目录下，加载时用的方法如下：看图即可（北桥中学在不同的目录下）

function PaperPublish(id, name) {
            //获得数据库中已选择的班级动态绑定到tree上

            $.ajax({
                type: "POST",
                url: "/eqes_Questionnaire/Manager/GetQueRangeTree.ashx?op=inittree",
                data: { scid: id },
                cache: false,
                success: function(result) {
                    //处理所有的返回值
                    var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                    treeObj.checkAllNodes(false);
                    var strs = new Array(); //定义一数组
                    strs = result.split(","); //字符分割
                    for (i = 0; i < strs.length; i++) {
                        if (strs[i] != "") {
                            var strche = strs[i].split("-");
                            //这里获得需要动态选择的节点以及该节点的根节点（我这里子节点可以在不同的根节点中）
                            if (strche[1] != null) {
                                //这里获得子节点所在的根目录节点
                                var nodell = treeObj.getNodeByParam("id", strche[1], null)
                                //在改目录节点下搜索符合条件的节点
                                treeObj.checkNode(treeObj.getNodeByParam("id", strche[0], nodell), true, true);
                            } else {
                                treeObj.checkNode(treeObj.getNodeByParam("id", strche[0], null), true, true);
                            }
                        }
                    }

                },
                error: function() { alert("请求失败"); }
            });

        }

再次记录一下

posted @ 2014-05-12 16:42  牧舟  阅读(587)  评论(0)  编辑  收藏  举报