嗨我在MVC中使用Jqgrid并且要求是这样的..在jqgrid的模型弹出窗口中添加/编辑一行..我有4列..
DateFrom ， DateTo ， 类型 ， 说明
我正在使用jquery datepicker ..
我的要求
添加第一行后添加第二行.. DateFrom 字段（第二行）应该是先前添加的行的 DateTo 字段的下一个日期
这是我的网格
initDateEdit = function (elem) {
setTimeout(function () {
$(elem).datepicker({
dateFormat: "m-d-yy",
showOn: "button",
changeYear: true,
changeMonth: true,
showButtonPanel: true,
showWeek: true
});
}, 50);
},
initDateSearch = function (elem) {
setTimeout(function () {
$(elem).datepicker({
dateFormat: "m-d-yy ",
changeYear: true,
changeMonth: true,
showButtonPanel: true,
showWeek: true
});
}, 50);
},
jQuery("#dateGrid").jqGrid({
height: 100,
width: 1000,
colNames: ['DateFrom', 'DateTo', 'Type', 'Remarks'],
colModel: [
{
name: 'DateFrom', index: 'DateFrom', width: 60, editable: true, sorttype: "date",
formatter: 'date',
formatoptions: {
srcformat: 'm/d/Y',
},
editoptions: { dataInit: initDateEdit, size: 14 },
},
{
name: 'DateTo', index: 'DateTo', width: 80, editable: true, sorttype: "date",
formatter: 'date',
formatoptions: {
srcformat: 'm/d/Y',
},
editoptions: {
dataInit: initDateEdit, size: 14,
},
},
{
name: 'Type', width: 80, editable: true, formatter: "select",
edittype: "select", editoptions: { value: "Open:Open;Maintainance:Maintainance;Closed:Closed", defaultValue: "Open" },
},
{
name: 'Remarks', index: 'Remarks', width: 80, editable: true
}
,
],
// multiselect:true,
pager: "#datePager",
loadonce: true,
sortname: 'Client',
ignoreCase: true,
sortorder: 'asc',
gridview: true,
autoencode: true,
rowNum: 10,
rowList: [5, 10, 20, 50],
caption: "Add Durations",
viewrecords: true,
editurl: "clientArray",
onSelectRow: function (id) {
var selRows = $(this).jqGrid('getGridParam', 'selarrrow');
if (selRows.length > 1) {
btnEdit.disabled = true;
btnDel.disabled = true;
}
else if (selRows.length == 1) {
btnEdit.disabled = false;
btnDel.disabled = false;
}
},
}).jqGrid("navGrid", "#datePager", { search: true, edit: false, add: false, del: false, searchtext: "Search" }, {}, {}, {
multipleSearch: true,
overlay: false,
onClose: function () {
$("div#ui-datepicker-div.ui-datepicker").hide();
}
}).jqGrid("filterToolbar", { defaultSearch: "cn" });
});
所以现在我需要访问网格中第一行的 DateTo 值。并且在 DateFrom 的默认值中写一个函数，将1添加到所获得的日期中 DateTo 并将其显示在 DateFrom 中 有人可以给我任何演示/帮助，以确定如何使这项功能正常工作？ 谢谢！
答案 0 :(得分：0)
这是我最终找到的解决方案。
的jQuery（ “＃GridId”）。的jqGrid（{
height: 100,
width: 1000,
colNames: ['Date From', 'Date To', 'Type', 'Remarks'],
colModel: [
{
name: 'DateFrom', index: 'DateFrom', width: 60, editable: true, sorttype: "date",
formatter: 'date',
formatoptions: {
srcformat: 'm/d/Y',
},
editoptions: { dataInit: initDateEdit, size: 14 ,
defaultValue: function () {
var ids = $("#GridId").jqGrid('getDataIDs');
if (ids.length >= 1) {
//get first id
var cl = ids[0];
//fetch row data
var rowData = $("#GridId").getRowData(cl);
//fetch individual cell value
var celValue = $("#GridId").jqGrid('getCell', cl, 'DateTo');
var currentTime = new Date(celValue);
var month = parseInt(currentTime.getMonth() + 1);
month = month <= 9 ? "0" + month : month;
var day = currentTime.getDate();
day = day <= 9 ? "0" + day : day;
var year = currentTime.getFullYear();
var months= [31,28,31,30,31,30,31,31,30,31,30,31];
var ndays = months[month - 1];
if (month == 02)
{
if (year % 100 == 0)
{
if (year % 400 == 0)
ndays=29;
}
else
if (year % 4 == 0)
ndays=29;
}
day = day + 1;
if(day>ndays)
{
day = 1;
month++;
}
if (month > 12)
{
month = 1;
year++;
}
return month + "/" + day + "/" + year;
}
return null;
}
},
},
{
name: 'DateTo', index: 'DateTo', width: 80, editable: true, sorttype: "date",
formatter: 'date',
formatoptions: {
srcformat: 'm/d/Y',
},
editoptions: { dataInit: initDateEdit, size: 14 },
},
{
name: 'Type', width: 80, editable: true, formatter: "select",
edittype: "select", editoptions: { value: "Occupied:Occupied;Vacant:Vacant;Maintainance:Maintainance", defaultValue: "Occupied" },
},
{
name: 'Remarks', index: 'Remarks', width: 80, editable: true
}
,
],
// multiselect:true,
pager: "#GridPAger",
loadonce: true,
sortable:true,
sortname: 'Client',
ignoreCase: true,
sortorder: 'asc',
gridview: true,
autoencode: true,
rowNum: 10,
rowList: [5, 10, 20, 50],
viewrecords: true,
editurl: "clientArray",
onSelectRow: function (id) {
var selRows = $(this).jqGrid('getGridParam', 'selarrrow');
if (selRows.length > 1) {
btnEdit.disabled = true;
btnDel.disabled = true;
}
else if (selRows.length == 1) {
btnEdit.disabled = false;
btnDel.disabled = false;
}
},
}).jqGrid("navGrid", "#GridPAger", { search: true, edit: false, add: false, del: false, searchtext: "Search" }, {}, {}, {
multipleSearch: true,
overlay: false,
onClose: function () {
// if we close the search dialog during the datapicker are opened
// the datepicker will stay opened. To fix this we have to hide
// the div used by datepicker
$("div#ui-datepicker-div.ui-datepicker").hide();
}
}).jqGrid("filterToolbar", { defaultSearch: "cn" });
});