jquery - 表单编辑期间的 jqGrid 内容类型

Question

我是 jqGrid 的新手。然而，主要是在 Oleg 答案的帮助下，能够成功地使用 jqGrid 开发应用程序。 我根据下拉列表的选择加载 jqGrid。数据从 Web 服务 (asmx) 文件返回。 代码是这样的

jQuery("#list").jqGrid({
    url: '<%= ResolveClientUrl("OfficeData.asmx/GetSCFS_RO") %>',
    editurl: '<%= ResolveClientUrl("OfficeData.asmx/SaveFPSUpdates") %>',
    datatype: "json",
    mtype: 'POST',
    ajaxGridOptions: { contentType: 'application/json; charset=utf-8' }, 
    ajaxEditOptions: { contentType: 'application/json; charset=utf-8', dataType: 'json' },
    serializeGridData: function (postData) {
        // return null;
        if (postData.OfficeId === undefined) { postData.OfficeId = 0; }
        else {
            postData.OfficeId = officeId;
        }
        return JSON.stringify(postData);
    }, 
    jsonReader: { repeatitems: false, root: "d.rows", page: "d.page",
        total: "d.total", records: "d.records" },
    colNames: ['FPSCode',  'Owner Name ', 'Licese_No', 'ShopAddress', 'Village',
        'License Valid From', 'Valid To','FPS Type','WholeSalerName',  'Mobile'],
    colModel: [{ name: 'FPSCode', index: 'FPSCode', width: 60, align: 'left',
        editable:true, editrules:{required:true}, 
        editoptions:{ 
            dataInit: function(element) { 
                $(element).attr("readonly", "readonly"); 
            } 
        }
    },
    ......

Firebug 显示以下帖子标题

响应 header

......
Content-Type      application/json; charset=utf-8
Date              Tue, 20 Nov 2012 14:20:34 GMT
Server            ASP.NET Development Server/10.0.0.0
X-AspNet-Version  4.0.30319

请求 header

Accept            application/json, text/javascript, */*; q=0.01
Accept-Encoding   gzip, deflate
Accept-Language   en-US,en;q=0.5
Cache-Control     no-cache
Connection        keep-alive
Content-Length    105
..........

正如预期的那样，我得到的响应是 JSON 对象。

但是，表单提交始终将 Content-Type 发送为 application/x-www-form-urlencoded；字符集=UTF-8

响应 header

Cache-Control     private, max-age=0
Connection        Close
Content-Length    95
Content-Type      text/xml; charset=utf-8
Date              Tue, 20 Nov 2012 14:20:46 GMT
Server            ASP.NET Development Server/10.0.0.0

请求 header

Accept            */*
Accept-Encoding   gzip, deflate
Accept-Language   en-US,en;q=0.5
Cache-Control     no-cache
Connection        keep-alive
Content-Length    254
Content-Type      application/x-www-form-urlencoded; charset=UTF-8
Cookie            ASP.NET_SessionId=utts2wlhdto4xhae34fzqkt4
Host              localhost:18017
Pragma            no-cache
Referer           Account/FPSUpdate.aspx
User-Agent        Mozilla/5.0 (Windows NT 6.1; WOW64; rv:16.0) Gecko/20100101 Firefox/16.0
X-Requested-With  XMLHttpRequest
X-AspNet-Version  4.0.30319

按照 Stackoverflow 的建议，我已经使用了

ajaxEditOptions:  { contentType: 'application/json; charset=utf-8', dataType: 'json' } , 

我什至尝试使用ajaxEditoptions at

jQuery.extend(jQuery.jgrid.edit, {
    ajaxEditOptions:  { contentType: 'application/json; charset=utf-8', dataType: 'json' },
    ...
});

但是，Content-Type 没有变化。 因此，我总是从服务器获得更新的 XML 响应。服务器的输出是

<string xmlns="http://tempuri.org/">Data Saved</string>

我无法将 Mime 类型修复为 JSON。请帮忙。

Answer 1

首先，我很高兴我以前的答案可以帮助您。

使用ajaxEditOptions作为jqGrid的选项确实不正确。选项为 editGridRow因此您必须将其作为属性包含在 navGrid 的 prmEdit 和 prmAdd 选项中或使用

$.extend($.jgrid.edit, {
    ajaxEditOptions: { contentType: "application/json" }
});

您写道您尝试使用非常接近的选项。我建议你再验证一次。为了确保该行将被执行，您可以将其包含在 JavaScript 脚本开头的某个位置。

我个人使用

$.extend($.jgrid.defaults, {
    ajaxGridOptions: { contentType: "application/json" },
    ajaxRowOptions: { contentType: "application/json", async: true },
    ajaxSelectOptions: { contentType: "application/json", dataType: "JSON" },
    ...
});
$.extend($.jgrid.edit, {
    ajaxEditOptions: { contentType: "application/json" },
    recreateForm: true,
    serializeEditData: function(postData) {
        return JSON.stringify(postData);
    },
    ....
});
$.extend($.jgrid.del, {
    ajaxDelOptions: { contentType: "application/json" }
    ...
});

一切都按预期进行:可以在相应请求的 HTTP header 中看到 Content-Type: application/json。

更新:我认为 jqGrid 奇怪行为的根源是我向 trirand 报告的小错误 here 。你可以自己在你的jquery.jqGrid.src.js副本中进行相应的修改或者保持规则:如果你在$.jgrid.edit<中定义了一些非标量(对象)选项 与 ajaxEditOptions 类似，您不应使用 navGrid 中的选项。如果您按照我在 the bug report 中所述修复 jqGrid 的代码该限制将不再存在。

更新2:该错误已在 github 上的主代码中修复(请参阅 here )。所以jqGrid的下一个版本(4.4.1以上)应该不会出现上述问题。