c#,jquery easy ui通过ajax实现异步加载tree
来源:互联网 发布:淘宝购物中心 编辑:程序博客网 时间:2024/05/14 16:14
新项目开始,打算通过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">
- c#,jquery easy ui通过ajax实现异步加载tree
- 自己动手做Jquery easy UI Tree(涉及到拖拽、修改、增加、删除、异步加载等操作..)
- jquery - easy - ui 下的tree (动态加载数据)
- jquery easy ui Tree详解
- thinkphp+ajax+jquery异步实现加载更多
- jQuery实现Ajax异步
- jquery异步加载之ajax
- jQuery:$post、$get、$ajax与php,实现异步加载
- jQuery:$post、$get、$ajax与php,实现异步加载
- easy ui tree+tabs实现菜单
- EasyUI实现异步加载Tree
- (Jquery 功能篇) Jquery ajax异步加载
- Easy UI的树形菜单的异步加载
- JQuery Easy-UI 实现动态分页
- JQuery Easy-UI 实现动态分页
- easy Ui + Jquery 弹窗 的实现
- easy Ui + Jquery 弹窗 的实现
- 通过ajax实现异步刷新
- [字符串][第二阶段-字符串处理][HDOJ-2093]考试排名
- 黑马程序员——第16天上——(API)集合框架(Map集合)
- [字符串][第二阶段-字符串处理][HDOJ-2081]手机短号
- RabbitMQ官网教程---简介
- 解决dsoframer 在X86和X64系统上的使用问题
- c#,jquery easy ui通过ajax实现异步加载tree
- linux中的TCL语言
- select, iocp, epoll,kqueue及各种I/O复用机制
- GeeksForGeeks java和c++的继承区别
- linux日志以及查看登录信息
- Give an O(log m + log n) algorithm to find the kth element in two sorted arrays
- Java项目性能监控和调优工具-Javamelody
- [最短路径] HDU 2680 - Choose the best route
- django-如何操作models.FileField数据类型