EasyUI扩展方法

EasyUI扩展方法：

1、我想指定textarea的行，但editor:{type:‘textarea‘, options: {rows:‘4‘}}这样写不行。请问大家怎么配置才是指定行的啊？

配置Textarea不可拖动变大变小：

 

只能自己扩展 textarea 才能实现，配置不用修改，直接扩展就行

Js代码  

  1. jQuery.extend(jQuery.fn.datagrid.defaults.editors, {
  2. combotree: {
  3. init: function(container, options){
  4. var editor = jQuery(‘<input type="text">‘).appendTo(container);
  5. editor.combotree(options);
  6. return editor;
  7. },
  8. destroy: function(target){
  9. jQuery(target).combotree(‘destroy‘);
  10. },
  11. getValue: function(target){
  12. var temp = jQuery(target).combotree(‘getValues‘);
  13. //alert(temp);
  14. return temp.join(‘,‘);
  15. },
  16. setValue: function(target, value){
  17. var temp = value.split(‘,‘);
  18. //alert(temp);
  19. jQuery(target).combotree(‘setValues‘, temp);
  20. },
  21. resize: function(target, width){
  22. jQuery(target).combotree(‘resize‘, width);
  23. }
  24. },
  25. textarea: {
  26. init : function(container, options) {
  27. var input = $(
  28. ‘<textarea class="datagrid-editable-input" style="resize:none;"></textarea>‘)
  29. .appendTo(container);
  30. return input;
  31. },
  32. getValue : function(target) {
  33. return $(target).val();
  34. },
  35. setValue : function(target, value) {
  36. $(target).val(value);
  37. },
  38. resize : function(target, width) {
  39. var input = $(target);
  40. if ($.boxModel == true) {
  41. input.width(width - (input.outerWidth() - input.width()));
  42. } else {
  43. input.width(width);
  44. }
  45. }
  46. }
  47. });

==========================================================================================

扩展jQuery easyui datagrid增加动态改变列编辑的类型

Js代码  

  1. $.extend($.fn.datagrid.methods, {
  2. addEditor : function(jq, param) {
  3. if (param instanceof Array) {
  4. $.each(param, function(index, item) {
  5. var e = $(jq).datagrid(‘getColumnOption‘, item.field);
  6. e.editor = item.editor;
  7. });
  8. } else {
  9. var e = $(jq).datagrid(‘getColumnOption‘, param.field);
  10. e.editor = param.editor;
  11. }
  12. },
  13. removeEditor : function(jq, param) {
  14. if (param instanceof Array) {
  15. $.each(param, function(index, item) {
  16. var e = $(jq).datagrid(‘getColumnOption‘, item);
  17. e.editor = {};
  18. });
  19. } else {
  20. var e = $(jq).datagrid(‘getColumnOption‘, param);
  21. e.editor = {};
  22. }
  23. }
  24. });

使用方式：

为password字段添加一个editor

Js代码  

  1. $("#gridId").datagrid(‘addEditor‘, {
  2. field : ‘password‘,
  3. editor : {
  4. type : ‘validatebox‘,
  5. options : {
  6. required : true
  7. }
  8. }
  9. });

删除password的editor

$("#gridid").datagrid(‘removeEditor‘, ‘password‘);

注：两个方法，第二个参数都可以传递数组。

==========================================================================================

Datagrid动态设置列标题的的扩展方法

在使用datagrid时候有时候需要动态的改变一下某一列的标题。但datagrid并没有提供这一方法，一下是一个扩展的方法可以供大家使用，希望对大家能有所帮助。

扩展方法如下：

Js代码  

  1. $.extend($.fn.datagrid.methods, {
  2. setColumnTitle: function(jq, option){
  3. if(option.field){
  4. return jq.each(function(){
  5. var $panel = $(this).datagrid("getPanel");
  6. var $field = $(‘td[field=‘+option.field+‘]‘,$panel);
  7. if($field.length){
  8. var $span = $("span",$field).eq(0);
  9. $span.html(option.text);
  10. }
  11. });
  12. }
  13. return jq;
  14. }
  15. });

调用方法如下：

Js代码  

  1. $("#dt").datagrid("setColumnTitle",{field:‘productid‘,text:‘newTitle});

==========================================================================================

其他：

Js代码  

  1. $.extend($.messager.defaults,{
  2. ok:"确定",
  3. cancel:"取消"
  4. });
  5. EASYUI TAB:
  6. var ctab = $(‘#xmlTab‘).tabs(‘getTab‘, ‘Response XML‘).panel(‘options‘).tab;
  7. ctab.hide();//隐藏卡片
  8. 解决思路：在进入行编辑状态后，获取combobox的编辑器并添加onChange事件，示例代码如下：
  9. var amount = $(‘#tt‘).datagrid(‘getEditor‘, {index:editLineIndex,field:‘amount‘}).target;   // 个数
  10. var sum = $(‘#tt‘).datagrid(‘getEditor‘, {index:editLineIndex,field:‘sum‘}).target; // 总数
  11. amount.combobox({
  12. onChange:function(id){
  13. sum.val(id*100);    // 假设是text编辑类型
  14. }
  15. });

baseui-all.min.js中方法使用：

其中方法如图：

Js代码  

  1. var __YUIToolbarItems = {
  2. getQueryItem: function() {
  3. return {
  4. method: "do_query",
  5. iconCls: "queryAction ope-search",
  6. text: "查询",
  7. enable: true
  8. }
  9. },
  10. getAddItem: function() {
  11. return {
  12. method: "do_add",
  13. iconCls: "addAction ope-add",
  14. text: "新增",
  15. enable: true
  16. }
  17. },
  18. getDelItem: function() {
  19. return {
  20. method: "do_del",
  21. iconCls: "delAction ope-remove",
  22. text: "删除",
  23. enable: true
  24. }
  25. }
  26. ..
  27. };

使用：

Js代码  

  1. $obj.datagrid({
  2. url : _root+‘/generic/query?__SERVICE_NAME=networkService‘,
  3. idField:‘id‘,
  4. queryParams: {
  5. networkId: networkId
  6. },
  7. singleSelect:true,
  8. showToolbar:true,
  9. toolbar: [
  10. //正常方法
  11. {method:‘do_add‘,iconCls: ‘ope-add‘,text:‘新增‘},
  12. //公用快捷方法
  13. __YUIToolbarItems.getAddItem(),
  14. __YUIToolbarItems.getSaveItem() ,
  15. __YUIToolbarItems.getCancelItem()
  16. ],
  17. ..

方便抽出公用按钮。

========================================

jUtil.js:

Java代码  

  1. /**
  2. * easyui扩展/常用的方法
  3. *
  4. * @author lk1312
  5. */
  6. // 定义全局对象
  7. var yxui = $.extend({}, yxui);
  8. $.parser.auto = false;
  9. $(function() {
  10. $.messager.progress({
  11. text : ‘数据加载中....‘,
  12. interval : 100
  13. });
  14. $.parser.parse(window.document);
  15. window.setTimeout(function() {
  16. $.messager.progress(‘close‘);
  17. if (self != parent) {
  18. window.setTimeout(function() {
  19. try {
  20. parent.$.messager.progress(‘close‘);
  21. } catch (e) {
  22. }
  23. }, 500);
  24. }
  25. }, 1);
  26. $.parser.auto = true;
  27. });
  28. $.fn.panel.defaults.loadingMessage = ‘数据加载中....‘;
  29. $.fn.datagrid.defaults.loadMsg = ‘数据加载中....‘;
  30. // 获得根路径 rootBasePath rootPath
  31. yxui.rootBasePath = function() {
  32. var curWwwPath = window.document.location.href;
  33. var pathName = window.document.location.pathname;
  34. var pos = curWwwPath.indexOf(pathName);
  35. var localhostPaht = curWwwPath.substring(0, pos);
  36. var projectName = pathName.substring(0, pathName.substr(1).indexOf(‘/‘) + 1);
  37. return (localhostPaht + projectName);
  38. };
  39. yxui.rootPath = function() {
  40. var pathName = window.document.location.pathname;
  41. return pathName.substring(0, pathName.substr(1).indexOf(‘/‘) + 1);
  42. };
  43. // 格式化字符串 formatString
  44. yxui.formatString = function(str) {
  45. for (var i = 0; i < arguments.length - 1; i++) {
  46. str = str.replace("{" + i + "}", arguments[i + 1]);
  47. }
  48. return str;
  49. };
  50. // 更换主题 changeTheme
  51. yxui.changeTheme = function(themeName) {
  52. var $yxuiTheme = $(‘#yxuiTheme‘);
  53. var url = $yxuiTheme.attr(‘href‘);
  54. var href = url.substring(0, url.indexOf(‘themes‘)) + ‘themes/‘ + themeName + ‘/easyui.css‘;
  55. $yxuiTheme.attr(‘href‘, href);
  56. var $iframe = $(‘iframe‘);
  57. if ($iframe.length > 0) {
  58. for (var i = 0; i < $iframe.length; i++) {
  59. var ifr = $iframe[i];
  60. $(ifr).contents().find(‘#easyuiTheme‘).attr(‘href‘, href);
  61. }
  62. }
  63. $.cookie(‘yxuiTheme‘, themeName, {
  64. expires : 7
  65. });
  66. };
  67. // 将form表单元素的值序列化成对象
  68. yxui.serializeObject = function(form) {
  69. var o = {};
  70. $.each(form.serializeArray(), function(index) {
  71. if (o[this[‘name‘]]) {
  72. o[this[‘name‘]] = o[this[‘name‘]] + "," + this[‘value‘];
  73. } else {
  74. o[this[‘name‘]] = this[‘value‘];
  75. }
  76. });
  77. return o;
  78. };
  79. // 操作权限控制 operId
  80. yxui.operId = function(_this) {
  81. $("#_operId").val($(_this).attr("_operId"));
  82. $("#_resOperId").val($(_this).attr("_resOperId"));
  83. $("#_resOperKey").val($(_this).attr("_resOperKey"));
  84. // console.info("set->" + $("#_operId").val());
  85. };
  86. // form提交 formSubmit
  87. yxui.formSubmit = function(_datagrid, _dialog, _form, _url, _callbak) {
  88. var _arg = ‘_menuId=‘ + $("#_menuId").val() + ‘&_operId=‘ + $("#_operId").val() + ‘&_resOperId=‘ + $("#_resOperId").val() + ‘&_resOperKey=‘ + $("#_resOperKey").val();
  89. _url = yxui.refreshUrlLink(_url, _arg);
  90. if (_form.form(‘validate‘)) {
  91. _form.form(‘submit‘, {
  92. url : _url,
  93. success : function(data) {
  94. _callbak(data, _datagrid, _dialog, _form, _url);
  95. }
  96. })
  97. }
  98. $("#_operId").val(‘‘);
  99. };
  100. // ajax提交 ajaxSubmit
  101. yxui.ajaxSubmit = function(_datagrid, _dialog, _form, _url, _data, _callbak) {
  102. // console.info("ajax get->" + $("#_operId").val());
  103. _data._operId = $("#_operId").val();
  104. _data._resOperId = $("#_resOperId").val();
  105. _data._resOperKey = $("#_resOperKey").val();
  106. $.ajax({
  107. url : _url,
  108. type : ‘post‘,
  109. data : _data,
  110. dataType : ‘json‘,
  111. cache : false,
  112. success : function(response) {
  113. _callbak(response, _datagrid, _dialog, _form, _url, _data);
  114. }
  115. });
  116. };
  117. // refreshUrlLink
  118. yxui.refreshUrlLink = function(_url, _arg) {
  119. var index = _url.indexOf(‘?‘);
  120. var length = _url.length;
  121. if (index < 0) {
  122. _url = _url + ‘?‘ + _arg;
  123. } else if (index == length - 1) {
  124. _url = _url + _arg;
  125. } else {
  126. _url = _url.substring(0, index + 1) + _arg + ‘&‘ + _url.substring(index + 1, length);
  127. }
  128. return _url;
  129. };
  130. // dotoHtml
  131. yxui.dotoHtml = function(tos) {
  132. var returnHtml = $(‘#rowOperation‘).html();
  133. if (null != returnHtml) {
  134. var maxArgsNumb = $(‘#_maxArgsNumb‘).val();
  135. if (maxArgsNumb == 0) {
  136. return returnHtml;
  137. } else {
  138. for (var i = 0; i < maxArgsNumb; i++) {
  139. returnHtml = returnHtml.replace(new RegExp("‘#arg" + i + "‘", "g"), typeof(tos[i]) == ‘undefined‘ ? ‘this‘ : tos[i]);
  140. }
  141. return returnHtml;
  142. }
  143. } else {
  144. return "";
  145. }
  146. }
  147. // dotoHtmlById
  148. yxui.dotoHtmlById = function(id, tos) {
  149. var returnHtml = $(‘#‘ + id).html();
  150. if (null != returnHtml) {
  151. var maxArgsNumb = tos.length;
  152. for (var i = 0; i < maxArgsNumb; i++) {
  153. returnHtml = returnHtml.replace(new RegExp("‘#arg" + i + "‘", "g"), typeof(tos[i]) == ‘undefined‘ ? ‘this‘ : tos[i]);
  154. }
  155. return returnHtml;
  156. } else {
  157. return "";
  158. }
  159. }
  160. // dotoDiyHtml
  161. yxui.dotoDiyHtml = function(returnHtml, tos, maxArgsNumb) {
  162. if (null != returnHtml) {
  163. if (null == maxArgsNumb || maxArgsNumb == 0) {
  164. return returnHtml;
  165. } else {
  166. for (var i = 0; i < maxArgsNumb; i++) {
  167. returnHtml = returnHtml.replace(new RegExp("‘#arg" + i + "‘", "g"), typeof(tos[i]) == ‘undefined‘ ? ‘this‘ : tos[i]);
  168. }
  169. return returnHtml;
  170. }
  171. } else {
  172. return "";
  173. }
  174. }
  175. // replaceAll
  176. yxui.replaceAll = function(_str, _from, _to) {
  177. if (null != _str) {
  178. return _str.replace(new RegExp(_from, "g"), _to);
  179. } else {
  180. return "";
  181. }
  182. }
  183. // getRequestArg
  184. yxui.getRequestArg = function() {
  185. var _url = location.search;
  186. var returnObject = {};
  187. var index = _url.indexOf("?");
  188. if (index != -1) {
  189. var str = _url.substr(index + 1);
  190. strs = str.split("&");
  191. for (var i = 0; i < strs.length; i++) {
  192. returnObject[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
  193. }
  194. }
  195. return returnObject;
  196. }
  197. // xui.getUrlArg
  198. yxui.getUrlArg = function(_url) {
  199. var index = _url.indexOf("?");
  200. if (index != -1) {
  201. var returnObject = {};
  202. var str = _url.substr(index + 1);
  203. strs = str.split("&");
  204. for (var i = 0; i < strs.length; i++) {
  205. returnObject[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
  206. }
  207. return returnObject;
  208. }
  209. return null;
  210. }
  211. function getrequest() {
  212. var url = location.search; // 获取url中"?"符后的字串
  213. // alert(url.indexOf("?"))
  214. var therequest = {};
  215. if (url.indexOf("?") != -1) {
  216. var str = url.substr(1);
  217. // alert(str)
  218. strs = str.split("&");
  219. for (var i = 0; i < strs.length; i++) {
  220. therequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
  221. }
  222. }
  223. return therequest;
  224. }
  225. /**
  226. * 扩展treegrid diyload treegrid查询功能
  227. */
  228. $.extend($.fn.treegrid.methods, {
  229. diyload : function(jq, param) {
  230. return jq.each(function() {
  231. var opts = $(this).treegrid("options");
  232. diyRequest(this, param);
  233. });
  234. }
  235. });
  236. function diyRequest(jq, param) {
  237. var opts = $.data(jq, "treegrid").options;
  238. if (param) {
  239. opts.queryParams = param;
  240. }
  241. if (!opts.url) {
  242. return;
  243. }
  244. var param = $.extend({}, opts.queryParams);
  245. if (opts.onBeforeLoad.call(jq, param) == false) {
  246. return;
  247. }
  248. setTimeout(function() {
  249. doRequest();
  250. }, 0);
  251. function doRequest() {
  252. $.ajax({
  253. type : opts.method,
  254. url : opts.url,
  255. data : param,
  256. dataType : "json",
  257. success : function(data) {
  258. $(jq).treegrid(‘loadData‘, data)
  259. },
  260. error : function() {
  261. if (opts.onLoadError) {
  262. opts.onLoadError.apply(jq, arguments);
  263. }
  264. }
  265. });
  266. }
  267. }
  268. /**
  269. * 扩展tree getCheckedExt 获得选中节点+实心节点 getSolidExt 获取实心节点
  270. */
  271. $.extend($.fn.tree.methods, {
  272. getCheckedExt : function(jq) {
  273. var checked = [];
  274. var checkbox2 = $(jq).find("span.tree-checkbox1,span.tree-checkbox2").parent();
  275. $.each(checkbox2, function() {
  276. var thisData = {
  277. target : this,
  278. "checked" : true
  279. };
  280. var node = $.extend({}, $.data(this, "tree-node"), thisData);
  281. checked.push(node);
  282. });
  283. return checked;
  284. },
  285. getSolidExt : function(jq) {
  286. var checked = [];
  287. var checkbox2 = $(jq).find("span.tree-checkbox2").parent();
  288. $.each(checkbox2, function() {
  289. var node = $.extend({}, $.data(this, "tree-node"), {
  290. target : this
  291. });
  292. checked.push(node);
  293. });
  294. return checked;
  295. }
  296. });
  297. /**
  298. * 扩展datagrid，添加动态增加或删除Editor的方法
  299. */
  300. $.extend($.fn.datagrid.methods, {
  301. addEditor : function(jq, param) {
  302. if (param instanceof Array) {
  303. $.each(param, function(index, item) {
  304. var e = $(jq).datagrid(‘getColumnOption‘, item.field);
  305. e.editor = item.editor;
  306. });
  307. } else {
  308. var e = $(jq).datagrid(‘getColumnOption‘, param.field);
  309. e.editor = param.editor;
  310. }
  311. },
  312. removeEditor : function(jq, param) {
  313. if (param instanceof Array) {
  314. $.each(param, function(index, item) {
  315. var e = $(jq).datagrid(‘getColumnOption‘, item);
  316. e.editor = {};
  317. });
  318. } else {
  319. var e = $(jq).datagrid(‘getColumnOption‘, param);
  320. e.editor = {};
  321. }
  322. }
  323. });
  324. /**
  325. * 扩展datagrid editor 增加带复选框的下拉树/增加日期时间组件/增加多选combobox组件
  326. */
  327. $.extend($.fn.datagrid.defaults.editors, {
  328. combocheckboxtree : {
  329. init : function(container, options) {
  330. var editor = $(‘<input />‘).appendTo(container);
  331. options.multiple = true;
  332. editor.combotree(options);
  333. return editor;
  334. },
  335. destroy : function(target) {
  336. $(target).combotree(‘destroy‘);
  337. },
  338. getValue : function(target) {
  339. return $(target).combotree(‘getValues‘).join(‘,‘);
  340. },
  341. setValue : function(target, value) {
  342. $(target).combotree(‘setValues‘, sy.getList(value));
  343. },
  344. resize : function(target, width) {
  345. $(target).combotree(‘resize‘, width);
  346. }
  347. },
  348. datetimebox : {
  349. init : function(container, options) {
  350. var editor = $(‘<input />‘).appendTo(container);
  351. editor.datetimebox(options);
  352. return editor;
  353. },
  354. destroy : function(target) {
  355. $(target).datetimebox(‘destroy‘);
  356. },
  357. getValue : function(target) {
  358. return $(target).datetimebox(‘getValue‘);
  359. },
  360. setValue : function(target, value) {
  361. $(target).datetimebox(‘setValue‘, value);
  362. },
  363. resize : function(target, width) {
  364. $(target).datetimebox(‘resize‘, width);
  365. }
  366. },
  367. multiplecombobox : {
  368. init : function(container, options) {
  369. var editor = $(‘<input />‘).appendTo(container);
  370. options.multiple = true;
  371. editor.combobox(options);
  372. return editor;
  373. },
  374. destroy : function(target) {
  375. $(target).combobox(‘destroy‘);
  376. },
  377. getValue : function(target) {
  378. return $(target).combobox(‘getValues‘).join(‘,‘);
  379. },
  380. setValue : function(target, value) {
  381. $(target).combobox(‘setValues‘, sy.getList(value));
  382. },
  383. resize : function(target, width) {
  384. $(target).combobox(‘resize‘, width);
  385. }
  386. }
  387. });
  388. /**
  389. * 扩展 datagrid/treegrid 增加表头菜单，用于显示或隐藏列，注意：冻结列不在此菜单中
  390. *
  391. * @param e
  392. * @param field
  393. */
  394. var createGridHeaderContextMenu = function(e, field) {
  395. e.preventDefault();
  396. var grid = $(this);/* grid本身 */
  397. var headerContextMenu = this.headerContextMenu;/* grid上的列头菜单对象 */
  398. if (!headerContextMenu) {
  399. var tmenu = $(‘<div style="width:150px;"></div>‘).appendTo(‘body‘);
  400. var fields = grid.datagrid(‘getColumnFields‘);
  401. for (var i = 0; i < fields.length; i++) {
  402. var fildOption = grid.datagrid(‘getColumnOption‘, fields[i]);
  403. if (!fildOption.hidden) {
  404. $(‘<div iconCls="icon-ok" field="‘ + fields[i] + ‘"/>‘).html(fildOption.title).appendTo(tmenu);
  405. } else {
  406. $(‘<div iconCls="icon-empty" field="‘ + fields[i] + ‘"/>‘).html(fildOption.title).appendTo(tmenu);
  407. }
  408. }
  409. headerContextMenu = this.headerContextMenu = tmenu.menu({
  410. onClick : function(item) {
  411. var field = $(item.target).attr(‘field‘);
  412. if (item.iconCls == ‘icon-ok‘) {
  413. grid.datagrid(‘hideColumn‘, field);
  414. $(this).menu(‘setIcon‘, {
  415. target : item.target,
  416. iconCls : ‘icon-empty‘
  417. });
  418. } else {
  419. grid.datagrid(‘showColumn‘, field);
  420. $(this).menu(‘setIcon‘, {
  421. target : item.target,
  422. iconCls : ‘icon-ok‘
  423. });
  424. }
  425. }
  426. });
  427. }
  428. headerContextMenu.menu(‘show‘, {
  429. left : e.pageX,
  430. top : e.pageY
  431. });
  432. };
  433. $.fn.datagrid.defaults.onHeaderContextMenu = createGridHeaderContextMenu;
  434. $.fn.treegrid.defaults.onHeaderContextMenu = createGridHeaderContextMenu;
  435. /**
  436. * 扩展 用于datagrid/treegrid/tree/combogrid/combobox/form加载数据出错时的操作
  437. *
  438. * @param XMLHttpRequest
  439. */
  440. var easyuiErrorFunction = function(XMLHttpRequest) {
  441. $.messager.progress(‘close‘);
  442. $.messager.alert(‘错误‘, XMLHttpRequest.responseText);
  443. };
  444. $.fn.datagrid.defaults.onLoadError = easyuiErrorFunction;
  445. $.fn.treegrid.defaults.onLoadError = easyuiErrorFunction;
  446. $.fn.tree.defaults.onLoadError = easyuiErrorFunction;
  447. $.fn.combogrid.defaults.onLoadError = easyuiErrorFunction;
  448. $.fn.combobox.defaults.onLoadError = easyuiErrorFunction;
  449. $.fn.form.defaults.onLoadError = easyuiErrorFunction;
  450. /**
  451. * 防止panel/window/dialog组件超出浏览器边界
  452. *
  453. * @param left
  454. * @param top
  455. */
  456. var easyuiPanelOnMove = function(left, top) {
  457. var l = left;
  458. var t = top;
  459. if (l < 1) {
  460. l = 1;
  461. }
  462. if (t < 1) {
  463. t = 1;
  464. }
  465. var width = parseInt($(this).parent().css(‘width‘)) + 14;
  466. var height = parseInt($(this).parent().css(‘height‘)) + 14;
  467. var right = l + width;
  468. var buttom = t + height;
  469. var browserWidth = $(window).width();
  470. var browserHeight = $(window).height();
  471. if (right > browserWidth) {
  472. l = browserWidth - width;
  473. }
  474. if (buttom > browserHeight) {
  475. t = browserHeight - height;
  476. }
  477. $(this).parent().css({/* 修正面板位置 */
  478. left : l,
  479. top : t
  480. });
  481. };
  482. $.fn.dialog.defaults.onMove = easyuiPanelOnMove;
  483. $.fn.window.defaults.onMove = easyuiPanelOnMove;
  484. $.fn.panel.defaults.onMove = easyuiPanelOnMove;
  485. /**
  486. * 扩展easyui的validator插件rules，支持更多类型验证
  487. */
  488. $.extend($.fn.validatebox.defaults.rules, {
  489. minLength : { // 判断最小长度
  490. validator : function(value, param) {
  491. return value.length >= param[0];
  492. },
  493. message : ‘最少输入 {0} 个字符‘
  494. },
  495. length : { // 长度
  496. validator : function(value, param) {
  497. var len = $.trim(value).length;
  498. return len >= param[0] && len <= param[1];
  499. },
  500. message : "输入内容长度必须介于{0}和{1}之间"
  501. },
  502. phone : {// 验证电话号码
  503. validator : function(value) {
  504. return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
  505. },
  506. message : ‘格式不正确,请使用下面格式:020-88888888‘
  507. },
  508. mobile : {// 验证手机号码
  509. validator : function(value) {
  510. return /^(13|15|18)\d{9}$/i.test(value);
  511. },
  512. message : ‘手机号码格式不正确‘
  513. },
  514. phoneAndMobile : {// 电话号码或手机号码
  515. validator : function(value) {
  516. return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value) || /^(13|15|18)\d{9}$/i.test(value);
  517. },
  518. message : ‘电话号码或手机号码格式不正确‘
  519. },
  520. idcard : {// 验证身份证
  521. validator : function(value) {
  522. return /^\d{15}(\d{2}[A-Za-z0-9])?$/i.test(value) || /^\d{18}(\d{2}[A-Za-z0-9])?$/i.test(value);
  523. },
  524. message : ‘身份证号码格式不正确‘
  525. },
  526. intOrFloat : {// 验证整数或小数
  527. validator : function(value) {
  528. return /^\d+(\.\d+)?$/i.test(value);
  529. },
  530. message : ‘请输入数字，并确保格式正确‘
  531. },
  532. currency : {// 验证货币
  533. validator : function(value) {
  534. return /^\d+(\.\d+)?$/i.test(value);
  535. },
  536. message : ‘货币格式不正确‘
  537. },
  538. qq : {// 验证QQ,从10000开始
  539. validator : function(value) {
  540. return /^[1-9]\d{4,9}$/i.test(value);
  541. },
  542. message : ‘QQ号码格式不正确‘
  543. },
  544. integer : {// 验证整数
  545. validator : function(value) {
  546. return /^[+]?[1-9]+\d*$/i.test(value);
  547. },
  548. message : ‘请输入整数‘
  549. },
  550. chinese : {// 验证中文
  551. validator : function(value) {
  552. return /^[\u0391-\uFFE5]+$/i.test(value);
  553. },
  554. message : ‘请输入中文‘
  555. },
  556. chineseAndLength : {// 验证中文及长度
  557. validator : function(value) {
  558. var len = $.trim(value).length;
  559. if (len >= param[0] && len <= param[1]) {
  560. return /^[\u0391-\uFFE5]+$/i.test(value);
  561. }
  562. },
  563. message : ‘请输入中文‘
  564. },
  565. english : {// 验证英语
  566. validator : function(value) {
  567. return /^[A-Za-z]+$/i.test(value);
  568. },
  569. message : ‘请输入英文‘
  570. },
  571. englishAndLength : {// 验证英语及长度
  572. validator : function(value, param) {
  573. var len = $.trim(value).length;
  574. if (len >= param[0] && len <= param[1]) {
  575. return /^[A-Za-z]+$/i.test(value);
  576. }
  577. },
  578. message : ‘请输入英文‘
  579. },
  580. englishUpperCase : {// 验证英语大写
  581. validator : function(value) {
  582. return /^[A-Z]+$/.test(value);
  583. },
  584. message : ‘请输入大写英文‘
  585. },
  586. unnormal : {// 验证是否包含空格和非法字符
  587. validator : function(value) {
  588. return /.+/i.test(value);
  589. },
  590. message : ‘输入值不能为空和包含其他非法字符‘
  591. },
  592. username : {// 验证用户名
  593. validator : function(value) {
  594. return /^[a-zA-Z][a-zA-Z0-9_]{5,15}$/i.test(value);
  595. },
  596. message : ‘用户名不合法（字母开头，允许6-16字节，允许字母数字下划线）‘
  597. },
  598. faxno : {// 验证传真
  599. validator : function(value) {
  600. return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
  601. },
  602. message : ‘传真号码不正确‘
  603. },
  604. zip : {// 验证邮政编码
  605. validator : function(value) {
  606. return /^[1-9]\d{5}$/i.test(value);
  607. },
  608. message : ‘邮政编码格式不正确‘
  609. },
  610. ip : {// 验证IP地址
  611. validator : function(value) {
  612. return /d+.d+.d+.d+/i.test(value);
  613. },
  614. message : ‘IP地址格式不正确‘
  615. },
  616. name : {// 验证姓名，可以是中文或英文
  617. validator : function(value) {
  618. return /^[\u0391-\uFFE5]+$/i.test(value) | /^\w+[\w\s]+\w+$/i.test(value);
  619. },
  620. message : ‘请输入姓名‘
  621. },
  622. engOrChinese : {// 可以是中文或英文
  623. validator : function(value) {
  624. return /^[\u0391-\uFFE5]+$/i.test(value) | /^\w+[\w\s]+\w+$/i.test(value);
  625. },
  626. message : ‘请输入中文‘
  627. },
  628. engOrChineseAndLength : {// 可以是中文或英文
  629. validator : function(value) {
  630. var len = $.trim(value).length;
  631. if (len >= param[0] && len <= param[1]) {
  632. return /^[\u0391-\uFFE5]+$/i.test(value) | /^\w+[\w\s]+\w+$/i.test(value);
  633. }
  634. },
  635. message : ‘请输入中文或英文‘
  636. },
  637. carNo : {
  638. validator : function(value) {
  639. return /^[\u4E00-\u9FA5][\da-zA-Z]{6}$/.test(value);
  640. },
  641. message : ‘车牌号码无效（例：粤B12350）‘
  642. },
  643. carenergin : {
  644. validator : function(value) {
  645. return /^[a-zA-Z0-9]{16}$/.test(value);
  646. },
  647. message : ‘发动机型号无效(例：FG6H012345654584)‘
  648. },
  649. same : {
  650. validator : function(value, param) {
  651. if ($("#" + param[0]).val() != "" && value != "") {
  652. return $("#" + param[0]).val() == value;
  653. } else {
  654. return true;
  655. }
  656. },
  657. message : ‘两次输入的密码不一致!‘
  658. }
  659. });
  660. /**
  661. * 扩展easyui validatebox的两个方法.移除验证和还原验证
  662. */
  663. $.extend($.fn.validatebox.methods, {
  664. remove : function(jq, newposition) {
  665. return jq.each(function() {
  666. $(this).removeClass("validatebox-text validatebox-invalid").unbind(‘focus.validatebox‘).unbind(‘blur.validatebox‘);
  667. // remove tip
  668. // $(this).validatebox(‘hideTip‘, this);
  669. });
  670. },
  671. reduce : function(jq, newposition) {
  672. return jq.each(function() {
  673. var opt = $(this).data().validatebox.options;
  674. $(this).addClass("validatebox-text").validatebox(opt);
  675. // $(this).validatebox(‘validateTip‘, this);
  676. });
  677. },
  678. validateTip : function(jq) {
  679. jq = jq[0];
  680. var opts = $.data(jq, "validatebox").options;
  681. var tip = $.data(jq, "validatebox").tip;
  682. var box = $(jq);
  683. var value = box.val();
  684. function setTipMessage(msg) {
  685. $.data(jq, "validatebox").message = msg;
  686. };
  687. var disabled = box.attr("disabled");
  688. if (disabled == true || disabled == "true") {
  689. return true;
  690. }
  691. if (opts.required) {
  692. if (value == "") {
  693. box.addClass("validatebox-invalid");
  694. setTipMessage(opts.missingMessage);
  695. $(jq).validatebox(‘showTip‘, jq);
  696. return false;
  697. }
  698. }
  699. if (opts.validType) {
  700. var result = /([a-zA-Z_]+)(.*)/.exec(opts.validType);
  701. var rule = opts.rules[result[1]];
  702. if (value && rule) {
  703. var param = eval(result[2]);
  704. if (!rule["validator"](value, param)) {
  705. box.addClass("validatebox-invalid");
  706. var message = rule["message"];
  707. if (param) {
  708. for (var i = 0; i < param.length; i++) {
  709. message = message.replace(new RegExp("\\{" + i + "\\}", "g"), param[i]);
  710. }
  711. }
  712. setTipMessage(opts.invalidMessage || message);
  713. $(jq).validatebox(‘showTip‘, jq);
  714. return false;
  715. }
  716. }
  717. }
  718. box.removeClass("validatebox-invalid");
  719. $(jq).validatebox(‘hideTip‘, jq);
  720. return true;
  721. },
  722. showTip : function(jq) {
  723. jq = jq[0];
  724. var box = $(jq);
  725. var msg = $.data(jq, "validatebox").message
  726. var tip = $.data(jq, "validatebox").tip;
  727. if (!tip) {
  728. tip = $("<div class=\"validatebox-tip\">" + "<span class=\"validatebox-tip-content\">" + "</span>" + "<span class=\"validatebox-tip-pointer\">" + "</span>" + "</div>").appendTo("body");
  729. $.data(jq, "validatebox").tip = tip;
  730. }
  731. tip.find(".validatebox-tip-content").html(msg);
  732. tip.css({
  733. display : "block",
  734. left : box.offset().left + box.outerWidth(),
  735. top : box.offset().top
  736. });
  737. },
  738. hideTip : function(jq) {
  739. jq = jq[0];
  740. var tip = $.data(jq, "validatebox").tip;
  741. if (tip) {
  742. tip.remove;
  743. $.data(jq, "validatebox").tip = null;
  744. }
  745. }
  746. });
  747. /**
  748. * 对easyui dialog 封装
  749. */
  750. yxui.dialog = function(options) {
  751. var opts = $.extend({
  752. modal : true,
  753. onClose : function() {
  754. $(this).dialog(‘destroy‘);
  755. }
  756. }, options);
  757. return $(‘<div/>‘).dialog(opts);
  758. };
  759. /**
  760. * 相同连续列合并扩展
  761. */
  762. $.extend($.fn.datagrid.methods, {
  763. autoMergeCells : function(jq, fields) {
  764. return jq.each(function() {
  765. var target = $(this);
  766. if (!fields) {
  767. fields = target.datagrid("getColumnFields");
  768. }
  769. var rows = target.datagrid("getRows");
  770. var i = 0, j = 0, temp = {};
  771. for (i; i < rows.length; i++) {
  772. var row = rows[i];
  773. j = 0;
  774. for (j; j < fields.length; j++) {
  775. var field = fields[j];
  776. var tf = temp[field];
  777. if (!tf) {
  778. tf = temp[field] = {};
  779. tf[row[field]] = [i];
  780. } else {
  781. var tfv = tf[row[field]];
  782. if (tfv) {
  783. tfv.push(i);
  784. } else {
  785. tfv = tf[row[field]] = [i];
  786. }
  787. }
  788. }
  789. }
  790. $.each(temp, function(field, colunm) {
  791. $.each(colunm, function() {
  792. var group = this;
  793. if (group.length > 1) {
  794. var before, after, megerIndex = group[0];
  795. for (var i = 0; i < group.length; i++) {
  796. before = group[i];
  797. after = group[i + 1];
  798. if (after && (after - before) == 1) {
  799. continue;
  800. }
  801. var rowspan = before - megerIndex + 1;
  802. if (rowspan > 1) {
  803. target.datagrid(‘mergeCells‘, {
  804. index : megerIndex,
  805. field : field,
  806. rowspan : rowspan
  807. });
  808. }
  809. if (after && (after - before) != 1) {
  810. megerIndex = after;
  811. }
  812. }
  813. }
  814. });
  815. });
  816. });
  817. }
  818. });
  819. /**
  820. * 左到右
  821. */
  822. yxui.left2right = function(but) {
  823. var $layout = $($(but).parents(‘.easyui-layout‘)[0]);
  824. var left = $layout.find(‘select‘)[0];
  825. var rigth = $layout.find(‘select‘)[1];
  826. if ($.browser.msie) {// IE 单独处理
  827. for (var i = 0; i < left.options.length; i++) {
  828. var option = left.options[i];
  829. if (option.selected) {
  830. var opt = new Option(option.text, option.value);
  831. rigth.options.add(opt);
  832. left.remove(i);
  833. }
  834. }
  835. } else {
  836. $(left.options).each(function(i, n) {
  837. if (n.selected) {
  838. n.selected = false;
  839. rigth.options.add(n);
  840. }
  841. });
  842. }
  843. };
  844. /**
  845. * 右到左
  846. */
  847. yxui.right2left = function(but) {
  848. var $layout = $($(but).parents(‘.easyui-layout‘)[0]);
  849. var left = $layout.find(‘select‘)[0];
  850. var rigth = $layout.find(‘select‘)[1];
  851. if ($.browser.msie) {// IE 单独处理
  852. for (var i = 0; i < rigth.options.length; i++) {
  853. var option = rigth.options[i];
  854. if (option.selected) {
  855. var opt = new Option(option.text, option.value);
  856. left.options.add(opt);
  857. rigth.remove(i);
  858. }
  859. }
  860. } else {
  861. $(rigth.options).each(function(i, n) {
  862. if (n.selected) {
  863. n.selected = false;
  864. left.options.add(n);
  865. }
  866. });
  867. }
  868. }
  869. /**
  870. * 左全到右
  871. */
  872. yxui.leftall2right = function(but) {
  873. var $layout = $($(but).parents(‘.easyui-layout‘)[0]);
  874. var left = $layout.find(‘select‘)[0];
  875. var rigth = $layout.find(‘select‘)[1];
  876. if ($.browser.msie) {// IE 单独处理
  877. for (var i = 0; i < left.options.length; i++) {
  878. var option = left.options[i];
  879. var opt = new Option(option.text, option.value);
  880. rigth.options.add(opt);
  881. }
  882. $(left).empty();
  883. } else {
  884. $(left.options).each(function(i, n) {
  885. rigth.options.add(n);
  886. });
  887. }
  888. };
  889. /**
  890. * 右全到左
  891. */
  892. yxui.rightall2left = function(but) {
  893. var $layout = $($(but).parents(‘.easyui-layout‘)[0]);
  894. var left = $layout.find(‘select‘)[0];
  895. var rigth = $layout.find(‘select‘)[1];
  896. if ($.browser.msie) {// IE 单独处理
  897. for (var i = 0; i < rigth.options.length; i++) {
  898. var option = rigth.options[i];
  899. var opt = new Option(option.text, option.value);
  900. left.options.add(opt);
  901. }
  902. $(rigth).empty();
  903. } else {
  904. $(rigth.options).each(function(i, n) {
  905. left.options.add(n);
  906. });
  907. }
  908. };
  909. /**
  910. * select 选择框数据采集
  911. *
  912. * @param options
  913. * @return 数组
  914. */
  915. yxui.findSelectMultipleValue = function(options) {
  916. var returnArr = [], ids = [], texts = [];
  917. if ($.browser.msie) {// IE 单独处理
  918. for (var i = 0; i < options.length; i++) {
  919. ids.push(options[i].value);
  920. texts.push(options[i].text);
  921. }
  922. } else {
  923. $(options).each(function(i, n) {
  924. ids.push($(n).val());
  925. texts.push($(n).html());
  926. });
  927. }
  928. returnArr.push(ids);
  929. returnArr.push(texts);
  930. return returnArr;
  931. }
时间： 2024-10-14 14:59:30

EasyUI扩展方法的相关文章

EasyUI扩展方法 + jutil.js

?          EasyUI扩展方法 + jutil.js             博客分类: jQueryEasyUi EasyUI扩展方法: 1.我想指定textarea的行,但editor:{type:'textarea', options: {rows:'4'}}这样写不行.请问大家怎么配置才是指定行的啊? 配置Textarea不可拖动变大变小:   只能自己扩展 textarea 才能实现,配置不用修改,直接扩展就行 Js代码   jQuery.extend(jQuery.fn.

easyui Datagrid方法扩展 - tooltip

最新版本的jQuery Easyui新出来了一个组件叫tooltip,就是提示框.以前的版本没有这个组件的时候就有很多在问,datagrid的单元格,我要加鼠标提示要怎么做.原来我告诉他们的方法都是用formatter,大概方法如下: formatter:function(value){ return '<span title="'+value+'">'+value+'<span>'; } 这样的方式就利用了浏览器自己的title特性,来达到显示效果.只是这种实

【开源】OSharp框架解说系列（3）：扩展方法

〇.前言 扩展方法使你能够向现有类型“添加”方法,而无需创建新的派生类型.重新编译或以其他方式修改原始类型. 扩展方法是一种特殊的静态方法,但可以像扩展类型上的实例方法一样进行调用. 对于用 C# 和 Visual Basic 编写的客户端代码,调用扩展方法与调用在类型中实际定义的方法之间没有明显的差异. 最常见的扩展方法是 LINQ 标准查询运算符,它将查询功能添加到现有的 System.Collections.IEnumerable 和 System.Collections.Generic.

easyui扩展行默认展开 以及 去除滚动条

问题背景: 在做打印页面的时候,要求有详细的默认展开显示. 遇到的问题: 1)在用扩展行的时候,grid的所有行都添加了展开收起的图标,(第二行没有明细)如下 2)默认展示有详细行的时候,内容被滚动条遮挡(影响打印) 3) 解决方法:在easyui扩展行的 onLoadSuccess 函数里进行处理 1 $list.datagrid({ 2 view: detailview, 3 onLoadSuccess: function (data) { 4 5 //没有详细的行 去掉 展示收起图标 6

c# 扩展方法奇思妙用基础篇五：Dictionary&lt;TKey, TValue&gt; 扩展

Dictionary<TKey, TValue>类是常用的一个基础类,但用起来有时确不是很方便.本文逐一讨论,并使用扩展方法解决. 向字典中添加键和值 添加键和值使用 Add 方法,但很多时候,我们是不敢轻易添加的,因为 Dictionary<TKey, TValue>不允许重复,尝试添加重复的键时 Add 方法引发 ArgumentException. 大多时候,我们都会写成以下的样子: var dict = new Dictionary<int, string>()

C#3.0 扩展方法

扩展方法 在很多时候我们需要编写各种各样的帮助类,因为官方提供的再全面,也会有未包含到的地方,这时一个静态的帮助类就可以帮我们解决问题 举一个不是很恰当的例子,假如要对一个字符串进行验证其内容不为null并且等于admin但是很多地方都要调用,按照封装思想要封装成一个方法,看起来可能是下面这样子的 这并没有任何问题,代码也是比较简单,但是很难会有一种亲近感,因为StringiHelper.ValidArg这样的调用存在.比如这个验证应该是官方应该考虑到的,但是他们忽略了,编写这样一个扩展后会有很

C#的扩展方法解析

在使用面向对象的语言进行项目开发的过程中,较多的会使用到"继承"的特性,但是并非所有的场景都适合使用"继承"特性,在设计模式的一些基本原则中也有较多的提到. 继承的有关特性的使用所带来的问题:对象的继承关系实在编译时就定义好了,所以无法在运行时改变从父类继承的实现.子类的实现与它父类有非常紧密的依赖关系,以至于父类实现中的任何变化必然会导致子类发生变化.当你需要复用子类时,如果继承下来的实现不适合解决新的问题,则父类必须重写它或被其他更适合的类替换,这种依赖关系限制

c# 之DataTable的扩展方法

由于太懒了,很久没更新了.毕业了,得好好装逼学习了,不能一心想着完了. 由于公司中的项目大量的使用DataTable,而每次对datatable进行操作的时候需要写很多相同的代码,所以秉着 装逼而学习 的态度,于是撸了几个扩展方法,记录下来,学习下.     class Program     {         public DataTable LinqTable = new DataTable();         void AddNewRow(int id, string name)   

Entity Framework DbSet&lt;T&gt;之Include方法与IQueryable&lt;T&gt;扩展方法Include的使用

Entity Framework使用Code First方式时,实体之间已经配置好关系,根据实际情况某些情况下需要同时获取导航属性,比如获取商品的同时需要获取分类属性(导航属性),或者基于优化方面考虑等,下面来看一个例子 例子中有会员实体类(Member)与角色实体类(Role),Role与Member的关系是1:n,控制台应用程序代码如下: using System; using System.Collections.Generic; using System.Linq; using Syst