easyui DateTimeBox OK

一、datetimebox   ok按钮没有点击事件，但是可以通过onSelect事件模拟出“点击了ok按钮一样的效果”，我的代码：
关键：
0，理解DateTimeBox控件，这个控件是由DateBox+TimeSpinner这2个控件组成的，而DateBox又继承自combo控件。
1，使用setText方法，设置控件文本框的内容，这个方法是DateTimeBox从combo控件中继承过来的。不能使用setValue方法，因
为这个方法是从DateBox继承过来的，但是DateTimeBox控件并没有重写这个方法，由于DateTimeBox还包含"时分秒"，所以无法使
用这个DateBox的方法。
2，使用spinner方法，获取“时分秒”信息，这个方法返回DateTimeBox中包含的TimeSpinner控件，使用TimeSpinner控件的getValue方法可以获得时间信息
3，使用onSelect方法，获取“日期”信息，onSelect:function(date){}，其中date是事件触发时选中的日期，是js的Date类型数据
4，使用hidePanel方法，把下拉日期面板关闭，该方法也是继承自combo控件
容易看懂的代码：
$('#TextStartTime').datetimebox({
   showSeconds:false,
   required:true,
   onSelect:function(date){
var time=$('#TextStartTime').datetimebox('spinner').spinner('getValue');
$('#TextStartTime').datetimebox('setText',date.getFullYear()+'-'+ (date.getMonth()+1) +'-'+date.getDate()+' '+ time);
$('#TextStartTime').datetimebox('hidePanel');
   }
});

让日期2014-1-2变成2014-01-02格式的代码：
$('#TextStartTime').datetimebox({
   showSeconds:false,
   required:true,
   onSelect:function(date){
var time=$('#TextStartTime').datetimebox('spinner').spinner('getValue');

$('#TextStartTime').datetimebox('setText',date.getFullYear()+'-'+ ((date.getMonth()+1)<10 ? ('0'+(date.getMonth()+1)) : (date.getMonth()+1))+'-'+((date.getDate())<10 ? ('0'+(date.getDate())) : (date.getDate()))+' '+time);
$('#TextStartTime').datetimebox('hidePanel');
   }
});

二、日期格式化

var sysformat = function (time, format) {
            var t = new Date(time);
            var tf = function (i) { return (i < 10 ? '0' : '') + i };
            return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function (a) {
                switch (a) {
                    case 'yyyy':
                        return tf(t.getFullYear());
                        break;
                    case 'MM':
                        return tf(t.getMonth() + 1);
                        break;
                    case 'mm':
                        return tf(t.getMinutes());
                        break;
                    case 'dd':
                        return tf(t.getDate());
                        break;
                    case 'HH':
                        return tf(t.getHours());
                        break;
                    case 'ss':
                        return tf(t.getSeconds());
                        break;
                }
            })
        }

三、扩展

EasyUI扩展方法 + jutil.js

博客分类：

• jQueryEasyUi

 

EasyUI扩展方法：

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

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

 

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

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增加动态改变列编辑的类型

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

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并没有提供这一方法，一下是一个扩展的方法可以供大家使用，希望对大家能有所帮助。

扩展方法如下：

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. });

调用方法如下：

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

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

其他：

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中方法使用：

其中方法如图：

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. };

使用：

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:

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. }

EASYUI API扩展（重要）

API扩展项目源码下载