El problema principal es que para poder seleccionar la fila necesita conocer la identificación de la nueva fila. En la mayoría de los casos, la id será generada por la base de datos donde guarda los datos en el servidor. Entonces, el primer requisito para su código de servidor es devolver el id en la nueva fila en la respuesta del servidor en la operación "agregar".
Por ejemplo, su código de servidor devuelve la identificación de su fila como la respuesta en la operación "agregar".
$("#list").jqGrid('navGrid', '#pager', {/*navGrid options*/}, {/*Edit optoins*/}, {
/*Add options:*/
reloadAfterSubmit: false,
afterSubmit: function (response) {
return [true, '', response.responseText];
},
addedrow: "last", // add new row at the end of grid
afterComplete: function (response, postdata) {
// this.gbox is the string like "#gbox_list"
var gridId = this.gbox.substr(6);
//if (postdata.oper === "add") {
// // highlight the new "added" row
// var row = $("#" + $.jgrid.jqID(postdata.id));
// row.effect("highlight", {}, 3000);
//}
$('#' + gridId).jqGrid('setSelection', postdata.id);
}
});
En la parte comentada de afterComplete
I que se muestra cómo se puede utilizar jQuery UI highlight efecto para resaltar la nueva fila añadida (ver the old answer). Puede ser una alternativa a la selección de la fila. También puede usar efectos de selección y resaltado.
La opción reloadAfterSubmit: false
tiene al menos dos inconvenientes.
- Si el uso uso ordenadas datos en la cuadrícula (
sortname
parámetro de jqGrid no está vacío) las filas de la cuadrícula se no correctamente ordenados después de la nueva fila se añadirá como la primera o como la última fila en la grilla
- Si la cuadrícula ya tiene las filas máximas por página (definida por el parámetro
rowNum
), la adición de una nueva fila seguirá a la cuadrícula con demasiadas filas por página.
Así que usted puede hacer lo siguiente
var idToSelect;
$("#list").jqGrid({
// ... all jqGrid options
loadComplete: function() {
if (idToSelect) {
$(this).jqGrid('setSelection', idToSelect);
//$("#" + $.jgrid.jqID(idToSelect)).effect("highlight", {}, 3000);
idToSelect = undefined;
}
}
}).jqGrid('navGrid', '#pager', {/*navGrid options*/}, {/*Edit optoins*/}, {
/*Add options:*/
afterSubmit: function (response) {
// save the id of new row. If the format of the data returned from
// the server is different you should change the next row
// corresponds to the returned data. For example if the server returns
// back JSON data in the form {"myId":"123"} you should use
// $.parseJSON(response.responseText).myId
// instead of response.responseText below
idToSelect = response.responseText;
return [true, '', response.responseText];
}
});
En el caso de la nueva fila añadida será seleccionado después de la carga de la red.
Debe describir más exactamente qué tipo de "inserción" utiliza. Por ejemplo, usa la edición de formularios. El usuario hace clic en el botón "Agregar" y los datos se guardarán correctamente en el servidor después de que el usuario haga clic en el botón "Enviar". Desea realizar alguna acción (modificar la respuesta del servidor) después de recibir la respuesta del servidor que los datos se agregaron con éxito. ¿Enviaste desde el servidor el 'id' de la nueva fila o no? – Oleg
Sí, el usuario hace clic en el botón "agregar", rellena los datos de la nueva fila, hace clic en el botón "enviar" y se crea una nueva fila en la tabla. No necesito modificar la respuesta del servidor. En este caso particular, solo necesito seleccionar la primera fila en la tabla, usando el método setSelection, pero necesito evitar ese comportamiento si se agregó la nueva fila. Es por eso que busco eventos para eso. – cincplug
Y tengo una identificación de fila enviada desde el servidor. – cincplug