jqGrid表单编辑 - 如何POST编辑行到sql server

时间:2012-11-13 20:12:10

标签: json jqgrid form-editing

我在我的sharepoint webpart中使用jqGrid并尝试使用表单编辑网格。 我不知道如何将数据发布回sql server数据库以进行添加/更新/删除。 我正在使用WCF服务,它将接受来自网格的JSON数据。

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

请帮忙。

0 个答案:

没有答案