我在我的 sharepoint webpart 中使用 jqGrid 并尝试使用表单编辑网格。我不知道如何将数据发布回 sql server 数据库以进行添加/更新/删除。我正在使用将接受来自网格的 JSON 数据的 WCF 服务。
WCF 方法:
[OperationContract]
[WebInvoke(BodyStyle = WebMessageBodyStyle.Wrapped,
Method = "POST",
RequestFormat = WebMessageFormat.Json,
ResponseFormat = WebMessageFormat.Json)]
bool UpdateProjectDeliverable(string ProjectName, string CriticalItemInfo);
JQGrid - 表单编辑:
$('#PrjDeliverablesGrid').jqGrid({
datatype: 'json',
colNames: ['ActivityDescription', 'Type', 'CompletionDate'],
colModel: [
{ name: 'ActivityDescription', index: 'ActivityDescription', width: 200, sortable: false, editable: true, edittype: "textarea", editoptions: { rows: "2", cols: "10" }, formoptions: { rowpos: 1, elmprefix: "(*)" }, editrules: { required: true} },
{ name: 'Type', index: 'Type', width: 90, editable: true, edittype: 'select', editoptions: {
value: function () {
var EditVal = LoadDeliverableTypes();
return EditVal;
}
}, /*editoptions: { value: "H:HandOver; CD:Charter (Draft); CF:Charter (Final); P0:Proto 0; P1:Proto 1; P2:Proto 2; P3:Proto 3" },*/formoptions: { rowpos: 2, elmprefix: " " }
},
{ name: 'CompletionDate', index: 'CompletionDate', width: 90, editable: true, sorttype: 'date', formatter: 'date',
editoptions: { size: 12,
dataInit: function (element) {
$(element).datepicker({ dateFormat: 'mm/dd/yyyy' });
},
defaultValue: function () {
var currentTime = new Date();
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();
return month + "/" + day + "/" + year;
}
},
formoptions: { rowpos: 3, elmprefix: "(*)", elmsuffix: "mm/dd/yyyy" }, editrules: { required: true }
}
],
rowNum: 10,
pager: '#pagerPrjDeliverables',
sortname: 'id',
sortorder: 'desc',
viewrecords: true,
autowidth: true,
gridview: true,
caption: 'Critical Activities/Deliverables'
});
$('#PrjDeliverablesGrid').jqGrid('navGrid', '#pagerPrjDeliverables',
{ view: true, edit: true, add: true, del: true },
{ edit: true,
afterShowForm: function (eparams) {
$('#PrjDeliverablesGrid').jqGrid('setGridParam', { SelCriticalItem: function () {
var row_id = $('#PrjDeliverablesGrid').jqGrid('getGridParam', 'selrow');
var tempCriticalInfo = new object();
tempCriticalInfo.DeliverableName = $('#PrjDeliverablesGrid').jqGrid('getCell', row_id, 'ActivityDescription');
var DeliverableTypeName = $('#PrjDeliverablesGrid').jqGrid('getCell', row_id, 'Type');
tempCriticalInfo.DeliverableTypeID = GetDeliverableTypeIDFromName(DeliverableTypeName);
tempCriticalInfo.CompletionDate = $('#PrjDeliverablesGrid').jqGrid('getCell', row_id, 'CompletionDate');
return tempCriticalInfo;
}
});
},
// serializeEditData: function (projDeliverableAddEditParams) { //USED ON EDIT
// return JSON.stringify(projDeliverableAddEditParams);
// },
onclickSubmit: function (params, SelCriticalItem) {
var Url = "http://vm0301cch:19511/_layouts/AGCO.PB.SharePointUI/WCFPBUtility/WCFPBUtility.svc";
var SelProjectName = document.getElementById("txtProjectID").value;
var data;
SelDelvProjectName = SelProjectName;
$('#PrjDeliverablesGrid').jqGrid({
params.url = Url + "/UpdateProjectDeliverable",
datatype: 'json',
mtype: 'POST',
editData: { ProjectName: SelDelvProjectName },
ajaxEditOptions: { contentType: 'application/json',
success: function (data) {
alert('Deliverables loaded successfully');
},
error: function (data) {
alert('Deliverables loading failed');
}
}
});
},
jqModal: true,
checkOnUpdate: true,
savekey: [true, 13],
navkeys: [true, 38, 40],
checkOnSubmit: true,
reloadAfterSubmit: false,
recreateForm: true,
closeOnEscape: true,
bottominfo: "Fields marked with (*) are required"
}); // edit options
请帮忙。