插件帮助文档 --- zTree

 

官方网站：

http://baby666.cn/hunter/index.html

http://www.baby666.cn/v3/api.php  API文档

 

插件描述：

功能强大的Tree控件.

 

 

说明：

12320项目原本使用的jquery.treeview插件，此插件需要自己实现html标签的编写，

 

 

插件使用：

一、     在ThinksKing的Plugins里面找到JQuery zTree v3.0 beta，将Js和Css添加到项目中。

二、     使用zTree:

1.1          添加Jquery和zTree的引用。

    <link href="http://www.cnblogs.com/Content/zTree/zTreeStyle.css" rel="stylesheet" type="text/css" />

    <script src="http://www.cnblogs.com/Scripts/Plugin/ZTree/jquery.ztree.core-3.0.min.js" type="text/javascript"></script>//核心代码

    <script src="http://www.cnblogs.com/Scripts/Plugin/ZTree/jquery.ztree.excheck-3.0.min.js" type="text/javascript"></script>// checkbox扩展

1.2          添加zTreeNode类（PS：注意大小写，对应参数要与文档中一致，否则需要对应参数容易出错，如果报null错，一般是参数对应出错）：

public class ZTreeNode

    {

        public string id { get; set; }

        public string pId { get; set; }

        public string name { get; set; }

        public string url { get; set; }

        public string target { get; set; }

}

1.3          异步调用

脚本代码：

     var url = '<%=Url.Action("GetGroups","ContactPerson") %>';

     var zTreeObj = null;

     var setting = {

         check: { //开启checkbox选项

             enable: true,

             chkBoxType: { "Y": "s", "N": "s" }//参看api

         },

         async: { //开启异步

 enable: true,

             url: url

         },

         data: {//参看api

             key: {

             },

             simpleData: { //简单数据模式

                 enable: true

             }

         }

     };

     $(document).ready(function() {

         $.fn.zTree.init($('#tree'), setting);

         zTreeObj = $.fn.zTree.getZTreeObj("tree");

     });

zTreeObj为父窗体的全局变量，可以在iframe的子窗体中使用:window.parent.zTreeObj 获取此对象.

页面代码：

  <ul id="tree" class="ztree"></ul>

控制器代码：

/// <summary>

        /// 获取用户组

        /// </summary>

        /// <returns></returns>

        public ActionResult GetGroups()

        {

            List<SM_Group> groups = ShortMessageHelper.GetGroups(User.Id);

            List<ZTreeNode> nodes = new List<ZTreeNode>();

            foreach (var item in groups)

            {

                ZTreeNode zNode = new ZTreeNode();

                zNode.id = item.GroupId.ToString();

                zNode.name = item.GroupName;

                zNode.url = Url.Action("SearchContactPerson", "ContactPerson", new { groupId = item.GroupId });

                zNode.pId = "";

                if (item.ParentId.HasValue)

                    zNode.pId = item.ParentId.ToString();

                zNode.target = "mainFrame";

                nodes.Add(zNode);

            }   

  

            return Json(nodes);

        }