ComIT Solutions on CellEdit Nav Doesn't Move to Next/Prev Row

Sat, 31 Aug 2013 09:13:31 +0300

Hi zardoz,

Nice work, while finding next and previous editable cell, wouldn't it be ideal if we consider the hidden columns also (by mistake if a hidden column is set editable:true) .

like .

if ($t.p.colModel[i].editable === true && $t.p.colModel[i].hidden === false ) {

nCol = i;

break;

}

and how about adding a new row when enter-key is pressed and last editable cell of last row .

When we tried to do that, we were able to add new row using grid.jqGrid("addRowData",defcolValues,last);, but that row opened in in-line edit mode that is all the editable coulmns are showing textboxes and could not continue that row in cellEdit mode.

Any idea or guidelines are deeply appriciated.

thanks and best regards.

ComIT Solutions

tony on CellEdit Nav Doesn't Move to Next/Prev Row

Wed, 31 Jul 2013 13:48:48 +0300

Hello,

Thank you very much for sharing your code.

Certainly I will test this and will make decision if I will include it.

Thanks again. I think that this is the way to help more people.

Kind Regards

Tony

zardoz on CellEdit Nav Doesn't Move to Next/Prev Row

Tue, 30 Jul 2013 22:50:39 +0300

Howdy,

I did some modifications to the NextCell/PrevCell methods so that when in CellEdit mode, tab moves to the next row when it's reached the end of the current row (and vice-versa for shift+tab). This is sorta half bug, half feature request, but it certainly makes large scale data entry easier.

Here's the code:

nextCell: function (iRow, iCol) {

return this.each(function () {

var $t = this, nCol = false, i;

if (!$t.grid || $t.p.cellEdit !== true) {

return;

}

// try to find next editable cell

if (iCol + 1 != $t.p.colModel.length) {

i = iCol + 1;

}

else {

if (iRow == $t.p.reccount) {

return;

}

i = 0;

iRow++;

}

for (i; i < $t.p.colModel.length; i++) {

if ($t.p.colModel[i].editable === true) {

nCol = i;

break;

}

if (i == $t.p.colModel.length - 1) {

i = 0;

iRow++;

}

if (nCol !== false) {

$($t).jqGrid("editCell", iRow, nCol, true);

}

else {

if ($t.p.savedRow.length > 0) {

$($t).jqGrid("saveCell", iRow, iCol);

}

});

prevCell: function (iRow, iCol) {

return this.each(function () {

var $t = this, nCol = false, i;

if (!$t.grid || $t.p.cellEdit !== true) {

return;

}

// try to find next editable cell

if (iCol != 0) {

i = iCol - 1;

}

else {

if (iRow == 1) {

return;

}

i = $t.p.colModel.length - 1;

iRow--;

}

for (i; i >= 0; i--) {

if ($t.p.colModel[i].editable === true) {

nCol = i;

break;

}

if (i == 0) {

i = $t.p.colModel.length - 1;

iRow--;

}

if (nCol !== false) {

$($t).jqGrid("editCell", iRow, nCol, true);

}

else {

if ($t.p.savedRow.length > 0) {

$($t).jqGrid("saveCell", iRow, iCol);

}

});

I also added a prevent default into the tab key event into the only usage of next cell (around line 9900 of the 4.5.2 src.js file), so that pressing tab doesn't launch whatever scrollable div the grid is in to the top:

if (e.keyCode === 9) {

if(!$t.grid.hDiv.loading ) {

//EDIT

e.preventDefault();

if (e.shiftKey) {$($t).jqGrid("prevCell",iRow,iCol);} //Shift TAb

else {$($t).jqGrid("nextCell",iRow,iCol);} //Tab

} else {

return false;

}

Hope this helps someone.

PS: This is my first post here. I've been using this as a resource for months, so I thought I'd try to contribute something. Thanks for all your help!

jQuery Grid Plugin - jqGrid - Topic: CellEdit Nav Doesn't Move to Next/Prev Row

ComIT Solutions on CellEdit Nav Doesn't Move to Next/Prev Row

tony on CellEdit Nav Doesn't Move to Next/Prev Row

zardoz on CellEdit Nav Doesn't Move to Next/Prev Row