Inline editing is a quick way to update database information by supporting editing directly in the row of the grid.
In order to integrate this feature easy with PHP we have created a formatter named actions where with a single line of code this feature can meet your requirments. See the implementation here

If you want to use this feature in your application with logic different in the one that is provided in the formatter actions, you should write a custom Java Script code.

In this case you can use one of the following PHP methods

setGridEvent
callGridMethod
setJSCode

Below we list the JavaScript Methods that can be used.

Calling conventions (JavaScript):

jQuery("#grid_id").jqGrid('editRow',rowid, keys, oneditfunc, succesfunc, url, extraparam, aftersavefunc,errorfunc, afterrestorefunc);
where
  • grid_id is the already constructed grid
  • rowid: the id of the row to edit
  • keys: when set to true we can use [Enter] key to save the row and [Esc] to cancel editing.
  • oneditfunc: fires after successfully accessing the row for editing, prior to allowing user access to the input fields. The row's id is passed as a parameter to this function.

The row can not be edited if it has class 'not-editable-row' instead that in colModel some fields can have a property editable set to true.

When set in the editRow the parameter function oneditfunc should not be enclosed in quotes and not entered with () - show just the name of the function.

If keys is true, then the remaining settings – succesfunc, url, extraparam, aftersavefunc, errorfunc and afterrestorefunc - are passed as parameters to the saveRow method when the [Enter] key is pressed (saveRow does not need to be defined as jqGrid calls it automatically). For more information see saveRow method below.

When this method is called on particular row, jqGrid reads the data for the editable fields and constructs the appropriate elements defined in edittype and editoptions

Saves the edited row.

jQuery("#grid_id").jqGrid('saveRow',rowid, succesfunc, url, extraparam, aftersavefunc,errorfunc, afterrestorefunc);

where

  • rowid: the id of the row to save
  • succesfunc: if defined, this function is called immediately after the request is successful. This function is passed the data returned from the server. Depending on the data from server; this function should return true or false.
  • url: if defined, this parameter replaces the editurl parameter from the options array. If set to 'clientArray', the data is not posted to the server but rather is saved only to the grid (presumably for later manual saving).
  • extraparam: an array of type name: value. When set these values are posted along with the other values to the server.
  • aftersavefunc: if defined, this function is called after the data is saved to the server. Parameters passed to this function are the rowid and the response from the server request.
  • errorfunc: if defined, this function is called after the data is saved to the server. Parameters passed to this function are the rowid and the the response from the server request.
  • afterrestorefunc if defined, this function is called in restoreRow (in case the row is not saved with success) method after restoring the row. To this function we pass the rowid

When set in the saveRow the parameters functions should not be enclosed in quotes and not entered with () - show just the name of the function.

Except when url (or editurl) is 'clientArray', when this method is called, the data from the particular row is POSTED to the server in format name: value, where the name is a name from colModel and the value is the new value. jqGrid also adds, to the posted data, the pair id: rowid. For example,

jQuery("#grid_id").jqGrid('saveRow',"rowid", false);

will save the data to the grid and to the server, while

jQuery("#grid_id").jqGrid('saveRow',"rowid", false, 'clientArray');

will save the data to the grid without an ajax call to the server.


This method restores the data to original values before the editing of the row.

Calling convention:

jQuery("#grid_id").jqGrid('restoreRow',rowid, afterrestorefunc);

where

  • rowid is the row to restore
  • afterrestorefunc if defined this function is called in after the row is restored. To this function we pas the rowid