标签:des style blog http io color os ar for
Grid,Tree脚本:
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 onLoadSuccess: 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 = 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 = 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 onLoad: 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 ="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 onLoadSuccess: 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 };
标签:des style blog http io color os ar for
原文地址:http://www.cnblogs.com/wzk153/p/4059405.html