EasyUI 行编辑模式 databox的bug解决方法

时间:13-04-21 栏目:EasyUI, web前端 作者:zongyan86 评论:0 点击: 5,320 次

 

DataGrid在行编辑的状态下,日期会恢复到没格式化的状态,这让人很蛋疼。

如图所示:

111

可通过以下方法解决:

//扩展datagrid行编辑(datebox)
$(function () {
$.extend(
$.fn.datagrid.defaults.editors, {
datebox: {
init: function (container, options) {
var input = $('<input type="text">').appendTo(container);
input.datebox(options);
return input;
},
destroy: function (target) {
$(target).datebox('destroy');
},
getValue: function (target) {
return $(target).datebox('getValue');
},
setValue: function (target, value) {
$(target).datebox('setValue', formatDatebox(value));
},
resize: function (target, width) {
$(target).datebox('resize', width);
}
}
});
})
//行编辑时间格式化
function formatDatebox(value) {
if (value == null || value == '') {
return '';
}
var dt;
if (value instanceof Date) {
dt = value;
}
else {
dt = new Date(value);
if (isNaN(dt)) {
value = value.replace(/\/Date\((-?\d+)\)\//, '$1'); //标红的这段是关键代码,将那个长字符串的日期值转换成正常的JS日期格式
dt = new Date();
dt.setTime(value);
}
}
return dt.format("yyyy-MM-dd"); //这里用到一个javascript的Date类型的拓展方法,这个是自己添加的拓展方法,在后面的步骤3定义
}

 

format函数在之前的文章有用过,这边就不再累赘。
EasyUI datagrid时间格式化

http://www.kuaipao8.com/?p=323

 

datagrid直接调用:formatter:formatDatebox

 

web技术分享

 



声明: 本文由( zongyan86 )原创编译,转载请保留链接: EasyUI 行编辑模式 databox的bug解决方法

关注我们