asp.mvc + easyui 动态列
废话不多说，直接上代码：
@model Huacisoft.Model.Crm_Sys_Role @{ Layout = null; } <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>角色管理</title> <!--前后台公用样式开始--> <link rel="stylesheet" type="text/css" href="@Url.Content("~/Themes/Default/Common.css")" /> <!--前后台公用样式结束--> <!--后台样式开始--> <link rel="stylesheet" type="text/css" href="@Url.Content("~/Themes/Default/Admin.css")" /> <!--后台样式结束--> <!--EasyUI引用开始--> <link rel="stylesheet" type="text/css" href="@Url.Content("~/js/jquery-easyui-1.3.5/themes/default/easyui.css")" /> <link rel="stylesheet" type="text/css" href="@Url.Content("~/js/jquery-easyui-1.3.5/themes/icon.css")" /> <script type="text/javascript" src="@Url.Content("~/js/jquery-1.8.0.min.js")"></script> <script type="text/javascript" src="@Url.Content("~/js/jquery-easyui-1.3.5/jquery.easyui.min.js")"></script> <script type="text/javascript" src='@Url.Content("~/Js/jquery-easyui-1.3.5/locale/easyui-lang-" + ViewBag.Language + ".js")'></script> <!--EasyUI引用结束--> <!--前后台公用脚本封装开始--> <script type="text/javascript" src="@Url.Content("~/js/common.js")"></script> <script type="text/javascript" src="@Url.Content("~/js/dialog.js")"></script> <!--前后台公用脚本封装结束--> <style type="text/css"> .ItemTitle{background-image:url(../images/rolesBg.png);height:26px; padding-left:10px; line-height:26px; vertical-align:middle; font-weight:bold;} .ItemTitle input{ position: absolute; margin-top: 6px;*margin-top: -3px;} .ItemList{margin-top:10px; margin-bottom:15px;} .ItemList input{ margin-left:10px;} .theName{float:left; margin-top:-1px;*margin-top: 3px; padding-left:3px; padding-bottom:8px; } </style> <script type="text/javascript"> function FormatData(value) {//value, row, index //-1:不显示checkbox 0:没有该方法 1：没有该方法权限 2：有该方法权限 style='margin-left: 30%;' var newData = ""; // if (data == -1) { // newData = ' ' // } if (value.split(',')[0] == "-1") { newData = "<div >" + '<input title="该模块暂无此方法，请去模块管理页面核对！" id="' +value.split(',')[1] + '" type="checkbox" disabled="disabled" />' + "</div>" } if (value.split(',')[0] == "0") { newData = "<div >" + '<input id="' + value.split(',')[1] + '" type="checkbox" />' + "</div>" } if (value.split(',')[0] =="1") { newData = "<div >" + '<input id="' + value.split(',')[1] + '" type="checkbox" checked="checked" />' + "</div>" } return newData; } $(function () { var cols = new Array(); var col1 = {}; col1["field"] = "Module_Id"; col1["title"] = "模块"; col1["width"] = 130; col1["hidden"] = true; cols.push(col1); var col2 = {}; col2["field"] = "Module_Name"; col2["title"] = "模块"; col2["width"] = 60; col2["align"] = "left"; cols.push(col2); $.ajax({ url: '@Url.Action("LoadFunctionTitle", "System")', async: false, type: "POST", dataType: 'json', success: function (json) { var rows = json.rows; for (var i = 0; i < rows.length; i++) { var col = {}; col["field"] = rows[i].Function_EnglishName; col["title"] = rows[i].Funtion_Name; col["width"] = 30; col["align"] = "center"; col["formatter"] = function (value,row) {return FormatData(value);}; cols.push(col); //"{ field: '" + rows.Function_EnglishName + "', title: '" + rows[i].Funtion_Name + "', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) {return FormatData(value);}}"; } }, error: function (a, b, c) { $.messager.alert("@ViewBag.SystemInfo", "@ViewBag.Fail", 'warning'); } }); $('#DomainTable').treegrid({ url: '@Url.Action("LoadModuleForRole", "System")' + "[email protected]", iconCls: 'icon-ok', width: "90%", height: 650, rownumbers: false, nowrap: false, animate: true, fitColumns: true, idField: 'Module_Id', treeField: 'Module_Name', pagination: true, rowStyler: function (row) { if (row.persons > 1) { return 'background:#AAD684;color:#fff'; } }, singleSelect: true, //frozenColumns: [[{ field: 'ck', checkbox: true}]], // frozenColumns: [[{ field: 'ck', width: 40, formatter: function (value, row, index) { // return '<input type="radio" name="rd_action" />'; // } // }]], //queryParams: getQueryParams("search_go"), columns: [cols], // columns: [[ // { field: 'Module_Id', title: 'Module_Id', width: 60, sortable: true, hidden: true }, // { field: 'Module_Name', title: '@ViewBag.ModuleName', width: 60, sortable: true }, // { field: 'Search', title: '@ViewBag.Search', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // return FormatData(value); // } // }, // { field: 'Create', title: '@ViewBag.Add', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // //alert(FormatData(data)); // return FormatData(value); // } // }, // { field: 'Edit', title: '@ViewBag.Edit', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // return FormatData(value); // } // }, // { field: 'Delete', title: '@ViewBag.Delete', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // return FormatData(value); // } // }, // { field: 'Import', title: '@ViewBag.Import', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // return FormatData(value); // } // }, // { field: 'Export', title: '@ViewBag.Export', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // return FormatData(value); // } // }, // { field: 'Sync', title: '@ViewBag.Sync', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // return FormatData(value); // } // }, // { field: 'Print', title: '@ViewBag.Print', width: 30, align: 'center', editor: 'text', sortable: true, formatter: function (value, row, index) { // return FormatData(value); // } // } // ]], onBeforeLoad: function (row, param) { //移除头部批量勾选框 $(".datagrid-header-check input").css("visibility", "hidden"); //隐藏分页 $(".datagrid-pager").css("display", "none"); //$(".datagrid-pager").removeClass("datagrid-pager"); return true; }, onBeforeExpand: function (row) { if (row != null) { //动态设置展开查询的url var url = '@Url.Action("LoadRole", "Role")' + "?roleId=" + row.Role_Id; $("#DomainTable").treegrid("options").url = url; } return true; }, onLoadSuccess: function (row, data) { if (data.rows.length == 0) { $(".datagrid-view2 .datagrid-body").html("<div class='divNodataHeigth'>@ViewBag.NoData</div>"); } }, onClickRow: function (row) { $("input[name=rd_action]", $("div.datagrid-view1 tr.datagrid-row-selected")).attr("checked", "checked"); } }); }); </script> <script type="text/javascript"> $(function () { $("#Cancel").click(function(){ window.location.href='@Url.Content("Index")'; }); $("#Save").click(function () { var itemList = new Array(); $("#configDiv > div").find("input[type='checkbox']").each(function () { if ($(this).attr("checked")) { itemList.push($(this).attr("id")); } }) var itemAll = itemList.join(","); // alert(itemAll); $.ajax({ url: '@Url.Content("~/Role/Save")', async: false, type: "POST", dataType: 'text', data: { roleId: "@ViewBag.RoleId", funList: itemAll }, success: function (msg) { if (msg == "True") { $.messager.alert("@ViewBag.SystemInfo", "@ViewBag.Success", 'warning'); window.location.href="@Url.Content("~/Role/Index")"; } else { $.messager.alert("@ViewBag.SystemInfo", "@ViewBag.Fail", 'warning'); } }, error: function (msg) { $.messager.alert("@ViewBag.SystemInfo", "@ViewBag.Fail", 'warning'); } }); }); }) </script> </head> <body> <div class=""> <!--wrap class="header" div end --> <h3 class="h3Box"><span></span>权限配置</h3> @Html.TextBoxFor(m => m.Role_Id, new { style = "display:none" }) <div class=""> <div id="data" style="margin-top:10px;"> <div id="configDiv"> <table id="DomainTable"> </table> </div> <div>@ViewBag.CustomFieldTip</div> </div> <div class="ct" style=" text-align:center"> <div class="btnCenterBoxes"> <div class="classdetail_btn_box0101" id="divSubmit"> <span class="classdetail_btn_box0102" id="Save">@ViewBag.Save</span> </div> </div> <div class="btnCenterBoxes"> <div class="classdetail_btn_box0101" id="divCancel"> <span class="classdetail_btn_box0102" id="Cancel">@ViewBag.Back</span> </div> </div> @*<span id="Save" class="btnSpan btnBlue01 colorTextBlue btnText2">@ViewBag.Save</span> <a class="btnSpan btnBlue01 colorTextBlue btnText2" href="@Url.Content("Index")"><span id="Cancel" >@ViewBag.Back</span></a>*@ </div> </div> </div> <div id="divProcess" style=" display:none"> <div class="" style="position:absolute;width:100%;height:2040px;background:#b8b8b8;top:0;bottom:0;right:0;left:0; opacity: 0.5;filter:alpha(opacity=50)" > </div> <div class="iconMsg" style="position:absolute;top:1000px;left:44%;z-index:9999;line-height:30px;"> <p>@ViewBag.Submit...</p> </div> </div> </body> </html>