Come usare jqGrid con C # / ASP.NET e JSON.NET (e nessuna roba AJAX.NET)?

Question

OK, ci sto studiando da alcuni giorni e non sono particolarmente sicuro di cosa sto facendo di sbagliato. Se qualcuno ha esempi funzionanti di utilizzo di jqGrid con C # / ASP.NET e strumenti open source, per favore, per favore fatemi sapere dove trovarli. Qualche suggerimento su come trovare documentazione o strumenti decenti che potrei usare per eseguire il debug di questo sarebbe anche molto apprezzato (sono abbastanza nuovo su js / jQuery). Fondamentalmente ho solo bisogno della funzionalità di modifica sul posto, quindi se sto trascurando un'altra soluzione ovvia per questo, potrebbe essere utile sapere ... Mi piacerebbe evitare di usare AJAX.NET se possibile.

Mi sento come se stessi trascurando qualcosa di veramente ovvio qui.

Nel seguente esempio, visualizzo jqGrid, ma non mostra dati.

Ecco il JavaScript pertinente:

jQuery(document).ready(function(){ 
    jQuery("#role_assignment_table").jqGrid({ 
        url:'http://localhost:4034/WebSite2/PageItemHandler.asmx/GetPageItemRolesJson?id=3',
        mtype: 'GET',
        contentType: "application/json; charset=utf-8",
        datatype: "jsonstring",
        colModel:[
            {name:'Id', label:'ID', jsonmap:'Id'},
            {name:'Title', jsonmap:'Title'},
            {name:'AssignedTo', label:'Assigned To', jsonmap:'AssignedTo'},
            {name:'Assigned', jsonmap:'Assigned'},
            {name:'Due', jsonmap:'Due'},
            {name:'Completed', jsonmap:'Completed'}
        ],
        jsonReader: {
            page: "Page",
            total: "Total",
            records: "Records",
            root: "Rows",
            repeatitems: false,
            id: "Id"
        },
        rowNum:10,
        rowList:[10,20,30],
        imgpath: 'js/themes/basic/images',
        viewrecords: false,
        caption: "Role Assignments" 
    });  
});

---

HTML:

<table id="role_assignment_table" class="scroll" cellpadding="0" cellspacing="0" />

---

Il JSON generato: non sono sicuro che arrivi al jqGrid, o se al jqGrid non piacciono il mio JSON o il mio WebMethod, ma posso chiamarlo da solo quando vado all'URL corretto e ottenere la stringa di risultati JSON.

{"Page":"1","Total":1.0,"Records":"4",
"Rows":[
{"Id":1,"Item":null,"Title":"Story Manager","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":2,"Item":null,"Title":"Analysis","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":3,"Item":null,"Title":"Narrative","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":4,"Item":null,"Title":"Graphic","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"}
]
}

Saluti, William Riley-Land

Answer 1

Prima di fare qualsiasi altra cosa, scarica e installa questo:

http://www.fiddler2.com/fiddler2/

Ti permetterà di vedere esattamente cosa viene richiesto e rispedito dalle richieste jqGrid per ottenere i dati JSON.

Ho del codice per un jqGrid funzionante, ed ecco qualcosa di diverso:

datatype: "json"

Invece di:

datatype: "jsonstring"

Ho anche un campo chiamato colNames che è un array di stringhe che contengono nomi di colonne.

Infine, ho un campo pager che identifica un elemento che memorizzerà i controlli di paging ed è un DIV.

Answer 2

In ASP.NET, Date viene serializzata come JSON " / Date (tick) / & Quot; che non possono essere interpretati da jqGrid. Possibili soluzioni ( post ):

• scrivi un formattatore personalizzato per la griglia
• modifica i dati che inviamo alla griglia (inviando la data formattata come stringa)

Indica come hai implementato la visualizzazione della data con jqGrid?

Grazie.

Answer 3

Fai attenzione alla proprietà con distinzione tra maiuscole e minuscole tipo di dati deve essere tipo di dati con T maiuscolo.

Answer 4

Ho avuto esattamente lo stesso problema! La soluzione che mi è venuta in mente è creare un formatter JavaScript personalizzato:

$(this).jqGrid({  
   ...
   colModel: [
      {
      name: 'SomeDate', index: 'SomeDate', width: 100, formatter: ndateFormatter }
      }],
   ...
});


// Convert C# json Date.
function ndateFormatter(cellval, opts, rwdat, _act) {
    var time = cellval.replace(/\/Date\(([0-9]*)\)\//, '$1');
    var date = new Date();
    date.setTime(time);
    return date.toDateString();
}

Answer 5

Se hai problemi a far funzionare jqGrid con ASP.NET, dai un'occhiata a qui . Questo dovrebbe farti risparmiare un sacco di tempo.