JqGrid Inhaltstyp während der Formularbearbeitung

Question

Ich bin neu bei jqGrid. Allerdings konnte ich erfolgreich eine Anwendung mit jqGrid entwickeln, hauptsächlich mit Hilfe von Olegs Antworten. Ich lade ein jqGrid basierend auf der Auswahl von Dropdown-Menü. Die Daten werden von einer Web-Service (asmx) Datei zurückgegeben. Der Code sieht etwa so aus

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',  'Owners 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 zeigt den folgenden Post-Header an

Response Headers

......
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

Request Headers

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
..........

Wie erwartet erhalte ich als Antwort ein JSON-Objekt.

Jedoch sendet das Formular-Submit immer Content-Type als application/x-www-form-urlencoded; charset=UTF-8

Response Headers

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

Request Headers

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

Wie auf Stackoverflow vorgeschlagen habe ich verwendet

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

Ich habe sogar versucht, ajaxEditoptions zu verwenden bei

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

Allerdings gibt es keine Änderung im Content-Type. Deshalb erhalte ich immer eine XML-Antwort vom Server für die Aktualisierung. Die Ausgabe vom Server lautet

Daten gespeichert

Ich kann den Mime-Typ nicht auf JSON festlegen. Bitte um Hilfe.

Answer 1

Zunächst einmal freut es mich, dass meine alten Antworten Ihnen helfen konnten.

Die Verwendung von ajaxEditOptions als Option von jqGrid ist wirklich inkorrekt. Es ist eine Option von editGridRow und muss daher als Eigenschaft in der prmEdit und prmAdd Option von navGrid inkludiert werden oder Sie müssen es so verwenden:

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

Sie haben geschrieben, dass Sie versucht haben, eine sehr ähnliche Option zu verwenden. Ich empfehle Ihnen, es noch einmal zu überprüfen. Um sicherzustellen, dass die Zeile ausgeführt wird, können Sie sie irgendwo am Anfang Ihres JavaScript-Skripts inkludieren.

Ich persönlich benutze

$.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" }
    ...
});

und alles funktioniert wie erwartet: Man kann Content-Type: application/json im HTTP-Header der entsprechenden Anfragen sehen.

AKTUALISIERT: Ich glaube, dass die Ursache des merkwürdigen Verhaltens von jqGrid ein kleiner Bug ist, den ich an trirand gemeldet habe hier. Sie können entsprechende Änderungen selbst in Ihrer Kopie von jquery.jqGrid.src.js vornehmen oder die Regel befolgen: Wenn Sie einige nicht-skalar (Objekt) Optionen in $.jgrid.edit wie ajaxEditOptions definieren, sollten Sie die Optionen nicht in navGrid verwenden. Wenn Sie den Code von jqGrid wie in dem Bug-Bericht korrigieren, wird diese Einschränkung nicht mehr existieren.

AKTUALISIERT 2: Der Bug ist bereits behoben (siehe hier) im Hauptcode auf Github. Daher sollte die nächste Version von jqGrid (über 4.4.1) das beschriebene Problem nicht mehr haben.