jqGrid Paginierung funktioniert nicht mit json-Datentyp

Ich kann nicht scheinen, um jqGrid Paginierung arbeiten. Es ist nicht eine Anforderung, wenn ich auf weiter/zurück/neu laden oder wenn ich versuche zu filter. Sobald ich auf eine dieser Schaltflächen, werden alle Datensätze verschwinden.

Dies ist die erste Anforderung, die versendet wird, so können Sie sehen, dass alle diese Parameter werden übergeben.

 https://www.xxxxxxx.com/getallorders?contactId=333&bucketId=444&_search=false&nd=1366982305621&rows=2‌​0&page=1&sidx=PKId&sord=desc

Dieser gibt die richtige Anzahl der Datensätze, und wenn ich manuell ausführen, und übergeben Sie in sagen wir mal page=2 ich habe die richtigen stellen zurück. Das problem scheint zu sein, dass die Anfrage nicht gemacht.

jQuery("#grid").jqGrid({
    url:'/GetAllOrders',
    mtype: "GET", 
    datatype: "json", 
    jsonReader: {
        root: "Rows",
        page: "Page",
        total: "Total",
        records: "Records",
        repeatitems: false,
        userdata: "UserData",
        id: "Id"
    },
    postData: {
        contactId: currentUserId,
        bucketId: currentBucketId
    },
    colNames:[
        'Id',
        'Cancel',
        'Order #',
        'Order Date',
        'Bucket', 
        'Warehouse',
        'Destination',
        'Status',
        'Tracking #',
        'Transport By',
        'Ordered By',
        'Order Items'
    ],
    colModel:[
        {name:'Id',index:'Id', width:5, align:"center", hidden: true},
        {name:'Cancel', index:'Cancel',width:80, align:"center", formatter: cancelLinkFormatter, search:false },
        {name:'OrderNumber',index:'OrderNumber', width:80, align:"center"},
        {name:'OrderDate',index:'OrderDate', width:140, align:'right'},
        {name:'Bucket',index:'Bucket', width:180, align:"center", hidden: false},
        {name:'Warehouse',index:'Warehouse', width:80, align:"center", hidden: true},
        {name:'Destination',index:'Destination', width:150},
        {name:'StatusCode', index:'StatusCode', width:100, align: 'center'},
        {name:'TrackingNumber', index:'TrackingNumber', width:100, align: 'center'},
        {name:'TransportCompany', index:'TransportCompany', width:100, align: 'center'},
        {name:'OrderedBy', index:'OrderedBy', width:100, align: 'center'},
        {name:'OrderItems', index:'OrderItems', width:100, align: 'center'}
    ],
    viewrecords: true, 
    rowNum: 20,
    autowidth: false,
    width: 860,
    height: 450,
    rowList:[10,20,30,40,50],
    pager: jQuery('#pager'),
    sortname: 'Id',
    align: 'center',
    sortorder: "desc",
    loadonce: false,
    ignoreCase: true,
    caption:"Orders"
}).navGrid('#pager',{edit:false,add:false,del:false});
setSearchSelect('StatusCode');
jQuery("#grid").jqGrid('filterToolbar', {stringResult: true, searchOnEnter: false, defaultSearch: "cn"});

Dies ist die json-Antwort, die ich von dem server beim erstmaligen laden.

{
"Total":2,
"Page":1,
"Records":28,
"Rows":[
    {
        "PKId":1234,
        "OrderNumber":"XXXXXX97",
        "Cancel":"Cancel",
        "OrderDate":"Jul 11 2012 12:37PM",
        "Warehouse":"",
        "Bucket":"xxxxxxxx",
        "StatusCode":"Shipped Complete",
        "StatusLink":"View Info",
        "TrackingNumber":"xxxxxxx",
        "TransportCompany":"xxxxxxxx",
        "Destination":"xxxxxxx",
        "BucketId":110,
        "ShippingEmail":"xxxxxxxx",
        "OrderedBy":"xxxxxxxx",
        "OrderItem":"xxxxxxx"
    },
    .... MORE DATA HERE ... 20 OBJECTS ALL-TOGETHER WITHIN Rows Array
    {
        "PKId":13434,
        "OrderNumber":"XXXXXX97",
        "Cancel":"Cancel",
        "OrderDate":"Jul 11 2012 12:37PM",
        "Warehouse":"",
        "Bucket":"xxxxxxxx",
        "StatusCode":"Shipped Complete",
        "StatusLink":"View Info",
        "TrackingNumber":"xxxxxxx",
        "TransportCompany":"xxxxxxxx",
        "Destination":"xxxxxxx",
        "BucketId":110,
        "ShippingEmail":"xxxxxxxx",
        "OrderedBy":"xxxxxxxx",
        "OrderItem":"xxxxxxx"
    },
],
"UserData":null
}

Irgendwelche Vorschläge?

Btw, die Paginierung und Filterung war gut arbeiten, wenn ich loadonce: true und wenn ich geladen alle Daten auf einmal, jedoch durch zu viele Datensätze habe ich einfach die Schalter auf server-Seite.

BEARBEITEN
Ich habe das problem gefunden. Zunächst, ich bin sorry für die nicht wie der rest des Codes.
Sehen Sie, ich hatte auch loadComplete - und das war das problem verursacht für mich.
Code in der Frage der Arbeit, so ich danke allen für die Teilnahme.

Dies ist die loadComplete, die das problem verursacht. Einmal habe ich es entfernt, es begann paging richtig.

        loadComplete: function() {
        setParamsOnComplete();
        var myGrid = jQuery("#grid");
        var ids = myGrid.getDataIDs();
        for (var i = 0, idCount = ids.length; i < idCount; i++) {
            jQuery("#"+ids[i]+" a",myGrid[0]).click(function(e) {
                var hash=e.currentTarget.hash;//string like "#?id=0"
                if (hash.substring(0,6) === "#S?id=") {
                    var id = hash.substring(6,hash.length);
                    var text = this.textContent || this.innerText;
                    dialog.dialog({ title: 'Status Information', 
                        buttons:{   Ok: function() {
                                        jQuery( this ).dialog("close");
                                    }
                                },
                        open:   function() {
                                    jQuery('.ui-dialog-buttonpane').find('button:contains("Ok")').css('font-size', '10px');
                                }          
                    });
                    dialog.dialog('open');
                }
                if (hash.substring(0,6) === "#C?id=") {
                    var id = hash.substring(6,hash.length);
                    var text = this.textContent || this.innerText;
                    var changed = false;
                    var additionalMesages = "";
                    jQuery.post("DataFetcher.asp", { 'action': "cancelOrder", 'id':id }, function(xml) {
                        changed = (xml === 'True');
                        additionalMesages = xml;
                    }).success(function(){ 
                        if (changed){
                            showDialogCustomTitle("Success", "You've successfully cancelled the order " + id + ".");
                            jQuery("#grid").setGridParam({datatype:'xml', page:1}).trigger('reloadGrid');
                        }else if (additionalMesages.split("_")[1] == "2"){
                            showDialogCustomTitle("Error", additionalMesages.split("_")[2]);
                        }else if (additionalMesages.split("_")[1] == "1"){
                            showDialogCustomTitle("Error", additionalMesages.split("_")[2]);
                        }
                    });
                }
                //e.preventDefault();
            });
        }  
    },

Nächste Aufgabe für mich ist, um vielleicht herauszufinden, warum loadComplete das problem verursachen.

EDIT 2
Fand die erste Ausgabe mit loadComplete. Ich war zu müde, Letzte Nacht, um es zu bemerken, aber der übrig gebliebene code-aus der Zeit, als sich das Starterfeld war bestückt mit xml-und ausgelagert auf der client-Seite definitiv die Probleme verursacht. Danke Euch allen für die Beteiligung wieder. 🙂

jQuery("#grid").setGridParam({datatype:'xml', page:1}).trigger('reloadGrid');

  • kann u geben jsfiddle für diese???
  • Ich vermute, dass der Fehler sollte in der server-code. Wohl die Anfrage an den server wird sein tun an den server gesendet, aber der server gibt immer die erste Seite der Daten. Zusätzlich sollte man sich den Namen der Eigenschaft enthalten, die id der Zeile. Ihre JSON-Antwort enthält keine Id Eigenschaft, aber PKId statt. So sollten Sie ändern id: "Id" zu id: "PKId" innerhalb von jsonReader. Ich empfehle Ihnen, zusätzlich zu entfernen Sie nicht benötigte Id Spalte oder umbenennen Id Spalte PKId und fügen Sie key: true Eigenschaft der definition von PKId Spalte in colModel.
  • Entwickler-Tools nicht zeigen, jede Anfrage zu /GetAllOrders, wenn ich die Seite wechseln. Das ist kein normales Verhalten korrekt?
  • Darüber hinaus verändert id:"PKId" innerhalb jsonReader und Hinzugefügt key: true auf die definition von PKId Spalte in colModel aber ich bin immer noch vor dem gleichen Problem, aber danke für den Hinweis.
InformationsquelleAutor iboros | 2013-04-26
Schreibe einen Kommentar