jQgrid : Disable inline Save and Esc Handler while editing grid Row?

Question

I am developing a asp.net MVC 4 project which uses jQgrid for generating table data.In my generated grid i am providing an inline edit option for particular columns in a row.

My problem is like while editing a particular row if i press Enter or Esc key my selected row is going out of edit mode.

I want to disable those events Enter and Esc .

I googled about this problem and i get some interesting posts How to disable Save Handler on Jqgrid while doing editing

Here in the above reference post i can see that some of the lines are commented out from Jqgrid.src.js file which i dont think as a best solution.

Is there any other method so that i can disable both Enter and Esc Event in Jqgrid while doing inline editing.

Javascript COde

jQuery("#Grid").jqGrid({
        url: baseUrl + '/api/Controller/method',
        datatype: "json",
        mtype: "POST",
        colNames: ['Col1', 'Col2', 'Col3', 'Col4', 'Col5'],
        colModel: [
        { name: 'col1', index: 'col1', align: 'center', editable: true, key:true },
        { name: 'col2', index: 'col2', align: 'center' },
        { name: 'col3', index: 'col3', align: 'center', editable: true, key:true },
        { name: 'col4', index: 'col4', align: 'center' },
        { name: 'col5', index: 'col5', align: 'center', editable: true, key:true }
        ],
        jsonReader: {
            root: 'data',
            id: 'col2',
            repeatitems: false
        },
        pager: $('#Pager'),
        rowNum: 10,
        rowList: [10, 25, 50, 100],
        autowidth: true,
        shrinkToFit: false,
        viewrecords: true,
        loadonce: true,
        autoencode: true,
        multiselect: true,
        height: '100%',
        width: '100%',
        caption: "Record"

        });

Sample Grid Structure

Sample Grid Image

Note: Grid Image shown is not the actual grid generated with the above code.

Here in the above grid there are some columns are left editable.My scenario is like i want to put data in all editable column in each row , so that i can update the grid data to server by a button click placed below the grid(Button not shown in the above image).Here i am not using editUrl property of grid.

Currently if i edit first row and accidently if i press enter or Esc key the selected row will become non editable.I want to keep all editable cells in a row as editable untill i press the Submit button placed below the Grid.

My jQgrid Version is 4.5.4

Any help is appreciated.

Oleg Oleg · Accepted Answer · 2013-12-30T13:57:57

It's difficult to answer on the question which don't contains neither JavaScript code nor exact references on jqGrid version which you use. You don't describe in which form you use inline editing in the grid.

The usage of Esc and Enter during inline editing can be managed by keys: true option. The exact syntax of the usage of keys option depend on how you use inline editing. For example you can call editRow directly or use some other methods mile inlineNav or the formatter: "actions" which calls editRow for you. The default value of keys option is already false, so you change the value somewhere in your code to true.

jQgrid : Disable inline Save and Esc Handler while editing grid Row?

1 Answers