Existen algunos malentendidos. Si usa datatype: local
, debe llenar jqGrid usted mismo con métodos como addRowData
o establecer los datos de una vez con el parámetro data
(para jqGrid versión 3.7 y superior). Entonces, el uso de datatype: local
sigue a jqGrid, no cargue ningún dato y su parámetro datatype: processrequest
será ignorado.
Si desea utilizar loadonce: true
parámetro que está soportado desde la versión 3.7 del jqGrid, que deberían tener todos los parámetros de jqGrid para JSON o XML (por ejemplo datatype: json
en su caso) y un parámetro adicionalloadonce: true
. Luego, después de la primera carga de datos, jqGrid cambiará el tipo de datos a datatype: local
y luego funcionará independientemente en el servidor pero ignorará algunos parámetros (como datatype: processrequest
en su caso).
Una pequeña observación más. La mayoría de las propiedades de jsonReader
que utiliza en su ejemplo son las predeterminadas (consulte this wiki). Los parámetros de los que hace uso serán combinadas con las propiedades por defecto, por lo que es suficiente para utilizar como parámetro jsonReader: { repeatitems: false, id: "ID"}
ACTUALIZADO: OK Jeff. Me parece que para resolver su problema necesita más ejemplos de código de ambos lados: cliente y servidor. Aquí hay un pequeño ejemplo que creé y probé para ti.
Primero de todo, el lado del servidor. En el servicio web ASMX definimos un método Web que generan un conjunto de datos de prueba para su mesa:
public JqGridData TestMethod() {
int count = 200;
List<TableRow> gridRows = new List<TableRow> (count);
for (int i = 0; i < count; i++) {
gridRows.Add (new TableRow() {
id = i,
cell = new List<string> (2) {
string.Format("Name{0}", i),
string.Format("Title{0}", i)
}
});
}
return new JqGridData() {
total = 1,
page = 1,
records = gridRows.Count,
rows = gridRows
};
}
donde las clases JqGridData
y TableRow
se definen como la siguiente:
public class TableRow {
public int id { get; set; }
public List<string> cell { get; set; }
}
public class JqGridData {
public int total { get; set; }
public int page { get; set; }
public int records { get; set; }
public List<TableRow> rows { get; set; }
}
Aquí se puede ver, la web el método TestMethod
no tiene parámetros y publica los datos completos. La paginación, clasificación y búsqueda de datos se realizará mediante jqGrid (versión 3.7 o superior).
Para leer estos datos y puesto en jqGrid podemos hacer lo siguiente:
$("#list").jqGrid({
url: './MyTestWS.asmx/TestMethod',
datatype: 'json',
mtype: 'POST',
loadonce: true,
ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
serializeGridData: function (postData) {
return JSON.stringify(postData);
},
jsonReader: {
root: function (obj) { return obj.d.rows; },
page: function (obj) { return obj.d.page; },
total: function (obj) { return obj.d.total; },
records: function (obj) { return obj.d.records; }
},
colModel: [
{ name: 'name', label: 'Name', width: 250 },
{ name: 'title', label: 'Title', width: 250 }
],
rowNum: 10,
rowList: [10, 20, 300],
sortname: 'name',
sortorder: "asc",
pager: "#pager",
viewrecords: true,
gridview: true,
rownumbers: true,
height: 250,
caption: 'My first grid'
}).jqGrid('navGrid', '#pager', {edit: false, add: false, del: false, search: true},
{},{},{},{multipleSearch : true});
Algunos comentarios sobre la definición de jqGrid:
Para comunicarse con el servicio web ASMX través de JSON uno tiene que hacer lo siguiente en la solicitud correspondiente jQuery.ajax
:
dataType: 'json'
debe estar configurado.
contentType:'application/json; charset=utf-8'
debe estar configurado.
- el envío de datos al servidor debe estar codificado en JSON.
para hacer todas estas utilizo datatype
, ajaxGridOptions
y serializeGridData
parámetros de jqGrid. Hago codificación JSON con la función JSON.stringify
(el JavaScript correspondiente se puede descargar desde here).
Luego los datos recibidos deben decodificarse. Lo hago con mi función favorita de jqGrid - jsonReader
con funciones (consulte this SO post y this wiki).
Al final utilizamos loadonce: true
que cambian el datatype
de jqGrid 'json'
-'local'
y podemos utilizar inmediatamente la ventaja de paginación locales, clasificación y búsquedas avanzadas existentes ya jqGrid versión 3.7.
Si quiere hacer una búsqueda del lado del servidor, ordenar y buscar (o búsqueda avanzada) con el servicio web ASMX, también es posible. Para guardar un pequeño lugar aquí y para separar ejemplos de código, publicaré el ejemplo correspondiente en su otra pregunta, jqgrid Page 1 of x pager (vea la parte ACTUALIZADA).
Actualicé mi declaración jsonReader como sugirió y eliminé la línea setGridParam. Mantuve el valor de loadonce pero sigo viendo que vuelve al servidor cada vez. No parece estar funcionando. ¿Alguna otra sugerencia? – webdad3