JqGrid custom onCellSelect don't fire beforeSaveCell
I am writing a piece of code inside onCellSelect that accomplishes a lovely
onCellSelect: function (rowid, iCol, cellcontent) {
if (iCol > 0) {
$("#gridMain_d").jqGrid("resetSelection");
$("#gridMain_d").setSelection(rowid, true);
}
}
But the problem is that this beforeSaveCell code does n't run. I know this because as soon as I remove this code before the SaveCell starts working. I tried using the return statement, but nothing works.
UPDATE
I commented out the code written above and added this code
beforeSelectRow: function (rowid, e) {
var $self = $(this), iCol, cm,
$td = $(e.target).closest("tr.jqgrow>td"),
$tr = $td.closest("tr.jqgrow"),
p = $self.jqGrid("getGridParam");
if ($(e.target).is("input[type=checkbox]") && $td.length > 0) {
$self.jqGrid("setSelection", $tr.attr("id"), true, e);
}
else {
$self.jqGrid('resetSelection');
$self.jqGrid("setSelection", $tr.attr("id"), true, e);
}
return true;
},
But the beforeSaveCell event does n't fire.
UPDATE 2
This jsFiddle replicates the issue. http://jsfiddle.net/eranjali08/CzVVK/1175/
source to share
There are many callbacks that depend on each other. Moreover, it may be the difference of such dependencies in different versions of jqGrid. I recommend using beforeSelectRow
instead onCellSelect
because this will be the first callback that will be called when the jqGrid cell is clicked. All the information you might need can be obtained from the second parameter ( e
in the code below) beforeSelectRow
:
beforeSelectRow: function (rowid, e) {
var $self = $(this),
$td = $(e.target).closest("tr.jqgrow>td");
iCol = $.jgrid.getCellIndex($(e.target).closest($td[0]),
colModel = $self.jqGrid("getGridParam", "colModel"),
columnName = colModel[i].name;
//...
// one can use here $td.html(), $td.text() to access the content of the cell
// columnName is the name of the column which cell was clicked
// iCol - the index of the column which cell was clicked
return true; // or false to suppress the selection
}
You just need to remember beforeSelectRow
to return a value that tells jqGrid whether to select the selected row or not. Values false
or "stop"
, returned from beforeSelectRow
, suppress the selection of the clicked row. All other values are selectable.
UPDATED . I have analyzed your code again and I hope I have found the cause of your problem. You are using resetSelection
, which is evil in the case of using cell edit. Take a look at the last line resetSelection
.
t.p.savedRow = [];
It destroys an array containing information about the currently edited cell. Thus, the cell cannot be saved or restored any longer.
To fix the problem, you must remove resetSelection
from your code. If you really need to use resetSelection
, you should replace it with, for example, a loop with a call setSelection
. The relevant code might look something like this:
beforeSelectRow: function (rowid, e) {
var $self = $(this), iCol, cm, i, idsOfSelectedRows,
$td = $(e.target).closest("tr.jqgrow>td"),
$tr = $td.closest("tr.jqgrow"),
p = $self.jqGrid("getGridParam");
if ($(e.target).is("input[type=checkbox]") && $td.length > 0) {
$self.jqGrid("setSelection", $tr.attr("id"), true, e);
}
else {
//$self.jqGrid('resetSelection');
idsOfSelectedRows = p.selarrrow.slice(0); // make copy of the array
for (i = 0; i < idsOfSelectedRows.length; i++) {
$self.jqGrid("setSelection", idsOfSelectedRows[i], false, e);
}
$self.jqGrid("setSelection", rowid, false, e);
}
return false;
},
source to share