var intervalObj;
function activateEditMode(grid, curRowIndex, nextRowIndex, columnName, cell) {
    if (nextRowIndex >= 0 && nextRowIndex < grid.TotalRows) {
        var nextRowEl = grid.RootTable.GetRow(nextRowIndex);
        var curRowEl = grid.RootTable.GetRow(curRowIndex);
        var cell1 = nextRowEl.GetCell(cell);
        var cell2 = curRowEl.GetCell(cell);
        grid.SetFocus();
        cell2.Select(true);
        nextRowEl.Select();
        cell1.ActivateEdit();
    }
}

function WebGrid1_OnEditKeyDown(controlId, keyCode)
{
    // get the grid
    var grid = ISGetObject(controlId);
    // get current information about row and cell
    var activeEditCell = grid.GetActiveEditCell();
    var columnName = wgGetColNameByCell(activeEditCell.element);
    var curRow = activeEditCell.rowElement;
    var curRowIndex = curRow.rowIndex;
    var curCell = grid.GetActiveEditCell().cellIndex;


    if (keyCode == 38) { // if up arrow
        grid.ExitEdit(1, 0, 0);  // exit and update the row if dirty
                
        intervalObj = setInterval(function ()
        {
            if (!grid.IsInProgress)
            {
                activateEditMode(grid, curRowIndex, curRowIndex - 1, columnName, curCell - 1);
                clearInterval(intervalObj);
                intervalObj = null;
            }
        }, 5);

    }
            
    else if (keyCode == 40) {  // if down arrow or enter key
        grid.ExitEdit(1, 0, 0);  // exit and update the row if dirty

        intervalObj = setInterval(function ()
        {
            if (!grid.IsInProgress)
            {
                activateEditMode(grid, curRowIndex, curRowIndex + 1, columnName, curCell - 1);
                clearInterval(intervalObj);
                intervalObj = null;
            }
        }, 5);
    }
    return true;
}

I attached the page & video regarding this scenario. Please kindly have review on the attached file and let me know your response.

Regards,
Hans K.

Hello,

thanks for your help, But I need the support of left and right key, how to write js code yet.

Hello,

Please forgive me for lack of understanding about the reported problem.

I modified the JavaScript code by adding code to handle Left and Right key event.

I add a new function that suitable with Left and Right key event:

function activateEditModeColumn(grid, curCellIndex, nextCellIndex, curRowIndex){
    if (nextCellIndex >= 0 && nextCellIndex < grid.RootTable.Columns.length)
    {
        var curRowEl = grid.RootTable.GetRow(curRowIndex);
        var currCell = curRowEl.GetCell(curCellIndex);
        var nextCell = curRowEl.GetCell(nextCellIndex);
        grid.SetFocus();
        currCell.Select(true);
        curRowEl.Select();
        nextCell.ActivateEdit();
    }
}

I add a couple of line codes in WebGrid1_OnEditKeyDown function:

//if left arrow key
else if (event.keyCode == 37) {
    grid.ExitEdit(1, 0, 0); 

    intervalObj = setInterval(function ()
    {
        if (!grid.IsInProgress)
        {
            activateEditModeColumn(grid, curCell - 1, curCell - 2, curRowIndex);
            clearInterval(intervalObj);
            intervalObj = null;
        }
    }, 5);
}

//if right arrow key
else if (event.keyCode == 39) {
    grid.ExitEdit(1, 0, 0); 

    intervalObj = setInterval(function ()
    {
        if (!grid.IsInProgress)
        {
            activateEditModeColumn(grid, curCell - 1, curCell, curRowIndex);
            clearInterval(intervalObj);
            intervalObj = null;
        }
    }, 5);
}

I attached the modified page as well. Please kindly have review on the page once again.

Thank you.

Regards,
Hans K.

Hello,

I’m glad to hear that the JavaScript code suitable for your current scenario.

Should you have further question, please do not hesitate to contact us.

Thank you.

Regards,
Hans K.