当前位置: 首页 > 工具软件 > easy-ajax > 使用案例 >

c#,jquery easy ui通过ajax实现异步加载tree

水麒
2023-12-01

新项目开始,打算通过c# + jquery easy ui 设计一个通用的目录树加载模块。具体实现如下:


后台代码:

/// <summary>
        /// 返回Json格式的UILI string类型结构
        /// </summary>
        private void GetMenu()
        {
            int UserID = 0;
            int.TryParse(System.Web.HttpUtility.UrlDecode(Request["UserID"]), out UserID);
            if (UserID > 0)
            {
                //根据UserID获取 module列表 //这里定义是两重
                IList<Model.PM_Module> m_M_PM = new List<Model.PM_Module>();
                m_M_PM = m_B_PM.GetMenuByUserID(UserID);


                
                TreeNode root = new TreeNode("root", "root");


                //初定设置为两个层级
                foreach (Model.PM_Module item in m_M_PM)
                {
                    if (item.ParentModuleID == 0)
                    {
                        TreeNode pNode = new TreeNode(item.ModuleID.ToString(), item.ModuleName,"",item.URL,"");
                        foreach (Model.PM_Module cItem in m_M_PM)
                        {
                            if (cItem.ParentModuleID == item.ModuleID)
                            {
                                TreeNode cNode = new TreeNode(cItem.ModuleID.ToString(), cItem.ModuleName, "", cItem.URL, "");
                                pNode.ChildNodes.Add(cNode);
                            }
                        }
                        root.ChildNodes.Add(pNode);
                    }
                }

                //将树生成json字符串


                returnValue = CreateMenu(root);
            }
            else
            {
                returnValue = "";
            }




        }

        private string CreateMenu(TreeNode tree)
        {


            string strResult = "[";


            foreach (TreeNode child in tree.ChildNodes)
            {
                string strItem = "\"id\":\"{0}\",\"text\":\"{1}\",\"children\":{2},\"url\":\"{3}\",\"parenttext\":\"{4}\"";


                string strId = child.Text.ToString();
                string strUrl = child.NavigateUrl.ToString();//Lib.EncodeUrlParas(row["url"].ToString());
                
                string strMenuName = child.Value;
                string strMotion = "\"Regeditsrc('" + child.NavigateUrl + "','" + child.Parent.Value + "->" + child.Value + "')\"";
                string strParentText = "";
                if (child.Parent.Value != "root")
                {
                    strParentText = child.Parent.Value + "->" + child.Value;
                }
                string strChild = "[]";
                if (child.ChildNodes.Count>0)
                {
                    strChild = CreateMenu(child);              
                }


                strItem = string.Format(strItem, new string[] { strId, strMenuName, strChild,strUrl, strParentText });
                strResult += "{" + strItem + "}";
                strResult += ",";
            }
            if (strResult.EndsWith(","))
            {
                strResult = strResult.Substring(0, strResult.Length - 1);
            }
            strResult += "]";
            return  strResult ;
        }  

前台js:

<script type="text/javascript">
    $(document).ready(function () {
        loadMenuJson();
    });


    function loadMenuJson() {
        $.ajax({
            url: "CommonHelpers/Menu/GetJsonUiLiMenu.aspx",
            dataType: "html",
            data: {
                UserID: 1
            },
            success: function (returnValue) {
                if ($.trim(returnValue).length > 0) {
                    $('#Menu').tree({
                        data: eval(returnValue),
                        onClick: function (node) {
                            if (node.parenttext != "") {
                                Regeditsrc(node.url, node.parenttext);
                            }
                        }
                    });
                }
                else {


                }
            }
        });
    }
</script>
<script type="text/javascript">
    function Regeditsrc(src, center) {


        document.getElementById("mainFram").src = src;
        $('#bodydiv').layout('panel', 'center').panel({ title: center });


    }
</script>


前台html:

<ul id="Menu" class="easyui-tree" style="width: 100%; padding: 0 0 0 0; margin: 0 0 0 0;"  
         data-options="fit:true,dnd:false">

 类似资料: