jquery easy UI 自定义Editor日期控件(日期控件用的my97 date)

{field : 'deliveryDate',title : '交货日期',width : 145,resizable:false,align : 'center',editor:{type:'datetimebox'}

其中需要说明的是：type中的datetimebox就是自定义的editor日期控件名称，往后边看。

2.自定义日期控件代码：

function datetimebox() {
$.extend($.fn.datagrid.defaults.editors, {
datetimebox : {//datetimebox就是你要自定义editor的名称
init : function(container, options) {
var input = $('<input class="Wdate">')
.appendTo(container);
return input;
},
getValue : function(target) {
return $(target).val();
},
setValue : function(target, value) {
$(target).val(value);
},
resize : function(target, width) {
var input = $(target);
if ($.boxModel == true) {
input.width(width
- (input.outerWidth() - input.width()));
} else {
input.width(width);
}
}
}
});
}

其中，Wdate就是my97date开源日期控件的样式。

3.这时候定义好了，怎么加载？如何绑定事件？看下边：

toolbar:[{
text:'添加货品记录',
iconCls:'icon-add',
handler:function(){
$('#purchaseOrder').datagrid('endEdit', lastIndex);
$('#purchaseOrder').datagrid('appendRow',{
productNo:'',
brandName:'',
standard:'',
amount:'',
unitPrice:'',
subtotal:'',
deliveryDate:''
});
lastIndex = $('#purchaseOrder').datagrid('getRows').length-1;
$('#purchaseOrder').datagrid('selectRow', lastIndex);
$('#purchaseOrder').datagrid('beginEdit', lastIndex);

// 给自定义日期控件绑定事件
var editors = $('#purchaseOrder').datagrid('getEditors', lastIndex);
var date = editors[6];
date.target.bind('click',function() {
var dateStr = WdatePicker({dateFmt:'yyyy-MM-dd'});
});
}
}