先说下自己的项目需求，就是需要在表格生成后点击单元格要出现日期选择器，我使用的是jquery自己的Datepicker，其他日期插件使用方法大同小异（主要是在日期插件配置上不同）
引入插件的步骤这里就不讲了，相信用到这几个插件的小伙伴都知道怎么做。
步骤： 1.要将相应列的 editable 属性设为 true
$("#grid").jqGrid({
url : //数据链接url,
datatype : "json",
mtype : "GET",
colNames : [ "uuid", "名称", "生产日期" ,"备注"],
colModel : [ {
name : "uuid",
index : "uuid",
width : "130",
hidden : true
}, {
name : "name",
index : "name",
width : "130",
editable : true
}, {
name : "fromDate",
index : "fromDate",
width : "130",
editable : true
},{
name : "remark",
index : "remark",
width : "130",
editable : true,
} ],
rowList : [ 10, 20, 50, 100, 200 ],
rowId : "uuid",
pager : "#pager",
sortname : "name",
recordpos : "right",
viewrecords : true,
sortorder : "asc",
multiselect : false,
autowidth : true,
height : "auto",
multiselect : true,
jsonReader : {
root : "dataList",
total : "totalPages",
page : "currentPage",
records : "totalRows",
repeatitems : false
},
sortable : false,
cellEdit : true,// 表示表格可编辑
cellsubmit : "clientArray", // 表示在本地进行修改
afterEditCell : function(rowid, cellname, value, iRow, iCol) {
var cellId = iRow + "_" + cellname;
$("#" + cellId).datepicker({ dateFormat: "yy-mm-dd" });
}
});
2 在aferEditCell 方法后面加上插件
afterEditCell : function(rowid, cellname, value, iRow, iCol) {
var cellId = iRow + "_" + cellname;
$("#" + cellId).datepicker({ dateFormat: "yy-mm-dd" });
}
之后再点击生产日期列 下面的单元格时就可以出现日期选择器了。
