1 /*  2 * 文 件 名：EasyUICommon.js  3 * 功能描述：EasyUIJs函数  4 *  5 * 版    权：Copyright 2014-2020, ZhiKang Wu  6 * 版    本：V1.0.0  7 * 日    期：2014-10-23  8 *   9 */ 10 /* 11 * 参数说明（固定参数）： 12 * Grid按钮ID：（增加）btn_add，（修改）btn_edit，（删除）btn_del； 13 * Dialog窗体内ID：（窗体）OpenEditId，（保存按钮）btn_save，（取消按钮）btn_cancel； 14 * Grid ID前台赋值：InitGrid($("#"))，InitGrid($("."))，InitGrid($(""))；如果为空值则自动赋值Grid ID为$("#grid")； 15 *  16 */ 17  18 /// <reference path="jquery/1.8.3/jquery-1.8.3.min.js" /> 19 /// <reference path="easyui/1.3.6/jquery.easyui.js" /> 20 //**********************************************EasyUI Grid形式ONE**********************************************// 21 //加载表格datagrid 22 function InitGrid(gridId) { 23     if (gridId == undefined) { 24         gridId = $("#grid"); 25     } 26  27     gridId.datagrid({ 28         fit: true, 29         rownumbers: true, 30         singleSelect: true, 31         pagination: true, 32         pageSize: 10, 33         loadMsg: ‘数据加载中请稍后……‘, 34         //在用户选择一行的时候触发，参数包括： 35         //rowIndex：选择的行的索引值，索引从0开始。 36         //rowData：对应于所选行的记录。 37         onSelect: function (rowIndex, rowData) { 38             var count = gridId.datagrid("getSelections").length; 39             if (count == 1) { 40                 $("#btn_edit").linkbutton("enable"); 41                 $("#btn_del").linkbutton("enable"); 42             } 43  44         }, 45         //在数据加载成功的时候触发。 46         onl oadSuccess: function (data) { 47             $("#btn_edit").linkbutton("disable"); //按钮可用与否 48             $("#btn_del").linkbutton("disable"); 49         } 50     }); 51  52     $("#toolbarId a").each(function (index) { 53         var typeId = $(this).attr("id"); 54         var typeUrl = $(this).attr("data-url"); 55         var typeTitle = $(this).attr("title"); 56  57         if (typeUrl == undefined) { 58             $.messager.show({ 59                 title: "增删改URL", 60                 msg: "<div class=‘messager-icon messager-error‘></div><div>增删改URL为空,请联系技术部修改！</div><div style=‘clear: both;‘></div>" 61             }); 62             return false; 63         } 64  65         $("#" + typeId).linkbutton({ 66             plain: true, 67             onClick: function () { 68  69                 //row选择中的某一行数据 70                 var row = ""; 71                 if (typeId == "btn_add") { 72  73                     OpenEditDialog(gridId, typeTitle, row, typeUrl); 74  75                 } else if (typeId == "btn_del") { 76  77                     row = gridId.datagrid("getSelected"); 78                     if (row) { 79                         $.messager.confirm(‘确认删除‘, ‘您确认要删除数据吗？‘, function (d) { 80                             if (d) { 81                                 $.post(typeUrl, { Guid: row.Guid }, function (json) { 82                                     if (json.isSucc) { 83                                         gridId.datagrid("reload"); 84                                         $.messager.show({ 85                                             title: "成功提示", 86                                             msg: "<div class=‘messager-icon messager-info‘></div><div>" + json.resultMsg + "</div><div style=‘clear: both;‘></div>" 87                                         }); 88                                     } else { 89                                         $.messager.show({ 90                                             title: "失败提示", 91                                             msg: "<div class=‘messager-icon messager-error‘></div><div>" + json.resultMsg + "</div><div style=‘clear: both;‘></div>" 92                                         }); 93                                     } 94                                 }, ‘json‘); 95                             } 96                         }); 97                     } 98  99                 } else {100 101                     row = gridId.datagrid("getSelected");102 103                     OpenEditDialog(gridId, typeTitle, row, typeUrl);104 105                 }106 107             }108         })109 110     })111 112 113     $(‘#btn_search‘).searchbox({114         width: 250,115         searcher: function (value, name) {116             //查询参数直接添加在queryParams中    117             var queryParams = gridId.datagrid(‘options‘).queryParams;118             queryParams.value =http://www.mamicode.com/ value;119             gridId.datagrid(‘options‘).queryParams = queryParams;120             gridId.datagrid(‘reload‘);121         },122         prompt: ‘请输入查询的关键字‘123     });124 }125 //**********************************************EasyUI Grid形式ONE**********************************************//126 127 //**********************************************EasyUI Grid公用函数**********************************************//128 //弹框129 function OpenEditDialog(gridId, typeTitle, rowData, typeUrl) {130     var title = typeTitle;131     var href =http://www.mamicode.com/ typeUrl;132     var dlgEdit = $("<div/>").dialog({133         id: "OpenEditId",134         title: title,135         href: href,136         modal: true,137         width: 550,138         height: 250,139         buttons: [{140             id: "btn_save",141             text: "保存",142             iconCls: "icon-ok",143             handler: function () {144 145                 //提交对话框表单146                 $("#OpenEditId form").submit();147 148             }149         }, {150             id: "btn_cancel",151             text: "取消",152             iconCls: "icon-cancel",153             handler: function () {154 155                 //关闭对话框表单156                 $(dlgEdit).dialog("close");157 158             }159         }],160         onl oad: function () {161 162             //初始化表单163             InitForm(href, rowData, gridId);164 165         },166         onClose: function () {167             $(this).dialog("destroy");168         }169     });170 }171 //初始化表单172 function InitForm(url, rowData, gridId) {173     var fmEdit = $("#OpenEditId form").EasyuiAjaxForm({174         url: url,175         onSubmit: function () {176             // 验证表单数据有效性177             if ($(this).form("validate")) {178                 $("#btn_save").linkbutton("disable");179                 $("#btn_cancel").linkbutton("disable");180                 return true;181             } else {182                 return false;183             }184         },185         success: function (data) {186 187             $("#btn_save").linkbutton("enable");188             $("#btn_cancel").linkbutton("enable");189 190             var json = jQuery.parseJSON(data);191             if (json.isSucc) {192                 //表单提交成功193                 gridId.datagrid("reload");194                 gridId.treegrid("reload");195 196                 $("#OpenEditId").dialog("close");197 198                 $.messager.show({199                     title: "成功提示",200                     msg: "<div class=‘messager-icon messager-info‘></div><div>" + json.resultMsg + "</div><div style=‘clear: both;‘></div>"201                 });202             } else {203                 //表单提交失败204                 if (json.resultMsg != null) {205                     $.messager.show({206                         title: "失败提示",207                         msg: "<div class=‘messager-icon messager-error‘></div><div>" + json.resultMsg + "</div><div style=‘clear: both;‘></div>"208                     });209                 } else {210                     $.each(json.errors, function (i, n) {211                         $("#" + n.id, dlgEdit).validatebox({ validType: "fail[‘" + n.val + "‘]", invalidMessage: n.msg }).validatebox("validate").focus();212                     });213                 }214             }215         }216     });217     // 加载表单数据218     if (rowData != undefined) {219         $(fmEdit).form("load", rowData);220     }221 }222 223 $.fn.EasyuiAjaxForm = function (options, param) {224     return $(this).append(‘<input type="hidden" value ="http://www.mamicode.com/ajax" Name="EasyFormSubmitType"/>‘).form(options, param);225 };226 //**********************************************EasyUI Grid公用函数**********************************************//227 228 //**********************************************EasyUI Tree形式ONE**********************************************//229 // 初始化树形列表230 function InitTree(treeId) {231     if (treeId == undefined) {232         treeId = $("#tree");233     }234 235     treeId.treegrid({236         fit: true,237         singleSelect: true,238         rownumbers: true,239         animate: true,240         onSelect: function (row) {241             var count = treeId.treegrid("getSelections").length;242             if (count == 1) {243                 $("#btn_edit").linkbutton("enable");244                 $("#btn_del").linkbutton("enable");245                 $("#btn_AddPageTable").linkbutton("enable");246 247                 //$("#admin_menus_fields_treegrid").treegrid("load", { menuId: row.Id });如果还有其他树，可以再这里传入ID关联248 249             }250         },251         onl oadSuccess: function (data) {252             $("#btn_edit").linkbutton("disable");253             $("#btn_del").linkbutton("disable");254             $("#btn_AddPageTable").linkbutton("disable");255         }256     });257 258     // 为表格工具栏添加单击事件259     $("#btn_ExpandOrNot").linkbutton({260         plain: true,261         onClick: function () {262 263             var options = $(this).linkbutton("options");264             if (options.iconCls == "folder-close") {265                 $(this).linkbutton({ iconCls: "folder-open", text: "展开" });266                 treeId.treegrid("collapseAll");267             }268             else {269                 $(this).linkbutton({ iconCls: "folder-close", text: "折叠" });270                 treeId.treegrid("expandAll");271             }272 273         }274     });275     $("#btn_add").linkbutton({276         plain: true,277         onClick: function () {278             var selected = treeId.treegrid("getSelected");279             if (selected) {280 281                 OpenEditDialog(treeId, "add", { ParentGuid: selected.Guid }, "/Home/Add");282 283             } else {284 285                 OpenEditDialog(treeId, "add", "", "/Home/Add");286 287             }288         }289     });290     $("#btn_edit").linkbutton({291         plain: true,292         onClick: function () {293             var row = treeId.treegrid("getSelected");294             if (row) {295 296                 OpenEditDialog(treeId, "edit", row, "/Home/Modify");297 298             }299         }300     });301     $("#btn_del").linkbutton({302         plain: true,303         onClick: function () {304             var row = treeId.treegrid("getSelected");305             if (row) {306                 $.messager.confirm("确认删除", "您确认要删除数据吗？", function (d) {307                     if (d) {308 309                         $.post("/Home/Delete", { Guid: row.Guid }, function (json) {310                             if (json.isSucc) {311                                 treeId.treegrid("reload");312                                 $.messager.show({313                                     title: "成功提示",314                                     msg: "<div class=‘messager-icon messager-info‘></div><div>" + json.resultMsg + "</div><div style=‘clear: both;‘></div>"315                                 });316                             } else {317                                 $.messager.show({318                                     title: "失败提示",319                                     msg: "<div class=‘messager-icon messager-error‘></div><div>" + json.resultMsg + "</div><div style=‘clear: both;‘></div>"320                                 });321                             }322                         }, "json");323 324                     }325                 });326             }327         }328     });329 330     //添加页面表单331     $("#btn_AddPageTable").linkbutton({332         plain: true,333         onClick: function () {334             var row = treeId.treegrid("getSelected");335             if (row) {336 //                OpenAddPageTableDialog(row);337             }338         }339     });340 }341 //**********************************************EasyUI Tree形式ONE**********************************************//

 1 //扩展easyui表单的验证 2 $.extend($.fn.validatebox.defaults.rules, { 3     //验证汉字 4     CHS: { 5         validator: function (value) { 6             return /^[\u0391-\uFFE5]+$/.test(value); 7         }, 8         message: ‘请输入有效的汉字‘ 9     },10     //手机号码验证11     Tel: {//value值为文本框中的值12         validator: function (value) {13             var reg = /^(?:13\d|15\d)\d{5}(\d{3}|\*{3})$/;14             return reg.test(value);15         },16         message: ‘请输入有效的手机号码‘17     },18     //座机号码验证19     Phone: {//value值为文本框中的值20         validator: function (value) {21             var reg = /^((0\d{2,3})-)?(\d{7,8})(-(\d{3,}))?$/;22             return reg.test(value);23         },24         message: ‘请输入有效的座机号码‘25     },26     //国内邮编验证27     ZipCode: {28         validator: function (value) {29             var reg = /^[0-9]\d{5}$/;30             return reg.test(value);31         },32         message: ‘请输入有效的邮编‘33     },34     //数字35     Number: {36         validator: function (value) {37             var reg = /^\+?(:?(:?\d+\.\d+)|(:?\d+))$/;38             return reg.test(value);39         },40         message: ‘请输入有效的数字‘41     },42     //字母与数字验证43     StrAndNum: {44         validator: function (value) {45             var reg = /^(\d|[a-zA-Z])+$/;46             return reg.test(value);47         },48         message: ‘请输入有效的字母与数字‘49     },50     //一般身份证验证51     IDCard: {52         validator: function (value) {53             var reg = /(^\d{15}$)|(^\d{17}(\d|X)$)/;54             return reg.test(value);55         },56         message: ‘请输入有效的身份证‘57     },58     //IP验证59     IP: {60         validator: function (value) {61             var reg = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;62             return reg.test(value);63         },64         message: ‘请输入有效的IP地址‘65     },66     //非负整数验证(且首字不为零)67     Int: {68         validator: function (value) {69             var reg = /^[1-9]\d*$/;70             return reg.test(value);71         },72         message: ‘请输入有效的整数‘73     }74 })75 76 77 var Common = {78     SexFormatter: function (value, row, index) {79         if (row.Sex == ‘01‘) {80             return ‘男‘;81         } else {82             return ‘女‘;83         }84     },85     //EasyUI用DataGrid用日期格式化86     DateFormatter: function (value, row, index) {87 88 89     }90 };