jqGrid - Saving an Inline Edit not working

Question

I have a jqGrid with a list of users in it using inline add/edit functions. For some reason, I cannot get jqGrid to save the edits I have made when my saveEdit function is called, but the data will save if I press the enter key. If I comment out the inlineNav line of jqGrid, everything works as expected.

To clarify, no request is ever sent to the server when my saveEdit function is run. When I press the enter key, a request is sent to the server. Any idea what is going on?

Here is my code:

var editParams = {
    afterSubmit: processResponse, 
    successfunc: function(response) {
        var processed = processResponse(response);
        if(processed[0] !== true) {
            $.jgrid.info_dialog($.jgrid.errors.errcap, processed[1], $.jgrid.edit.bClose);
        }
        return processed[0];
    }, 
    bottominfo: 'Fields marked with an (*) are required', 
    keys: true
};
$.extend($.jgrid.edit, editParams);
$('#grid')
    .jqGrid({
        datatype: 'json', 
        colNames: ['User ID', 'First Name', 'Last Name', 'Email'], 
        colModel: [
            {name: 'usr_id', jsonmap: 'usr_id', width: 75, editable: true, editrules: {required: true}, formoptions: {elmprefix: '(*) '}}, 
            {name: 'usr_fname', jsonmap: 'usr_fname', width: 75, editable: true, editrules: {required: true}, formoptions: {elmprefix: '(*) '}}, 
            {name: 'usr_lname', jsonmap: 'usr_lname', width: 75, editable: true, editrules: {required: true}, formoptions: {elmprefix: '(*) '}}, 
            {name: 'usr_email', jsonmap: 'usr_email', width: 125, editable: true, editrules: {required: true}, formoptions: {elmprefix: '(*) '}}
        ], 
        grouping: true, 
        shrinkToFit: false, 
        height: 200, 
        width: 800, 
        rowNum: 20, 
        rowList: [10, 20, 30, 40, 50, 100], 
        repeatitems: false, 
        ignoreCase: true, 
        jsonReader: { repeatitems: false, id: 'usr_id'}, 
        pager: '#grid_pager', 
        url: 'dataurl.php', 
        editurl: 'editurl.php', 
        ondblClickRow: inlineEdit, 
        onSelectRow: saveEdit
    })
    .jqGrid('navGrid', '#users_pager', {add: false, edit: false, del: false, refresh: false, search: false})
    .jqGrid('inlineNav', '#users_pager', {edit: false, save: false, cancel: false}); //If I comment out this line, everything works perfectly

var lastSel;
/* Start editing the row */
function inlineEdit(id, iRow, iCol) {
    $(this).jqGrid('editRow', id, true, function() { focusRow(id, iCol, this); });
}

function focusRow(id, iCol, table) {
    var ele = document.getElementById(id + '_' + table.p.colModel[iCol].name), 
        length = ele.value.length;
    ele.focus();
    if(ele.setSelectionRange) { //IE
        ele.setSelectionRange(length, length);
    }
    else if(ele.createTextRange) {
        var range = ele.createTextRange();
        range.collapse(true);
        range.moveEnd('character', length);
        range.moveStart('character', start);
        range.select();
    }
}

function saveEdit(id) {
    if(id && id != $(this).data('lastSel')) {
        /* Save the last selected row before changing it */
        $(this).jqGrid('saveRow', $(this).data('lastSel'), editParams);
        $(this).data('lastSel', id);
    }
    $(this).data('lastSel', id);
}

Thank you in advance to anyone that helps me.

score 1 · Accepted Answer · answered Jul 31 '12 at 02:41

1

well buddy, you are not using inlineNav anyhow, why do u want to keep it there? second when you press enter, its not calling your saveEdit function, by default functionality is like this only.

I see you are saving your records on onSelectRow property and when press enter, after inline edit, this won't be called. You can make your keys:false. It will not trigger the request to server on enter key press.

answered Jul 31 '12 at 02:41

Piyush Sardana

1,748
4
19
33

I use the inline nav for adding records. Double clicking on a row brings up the inline editing. The method from onSelectRow is supposed to save the row, but never makes the call to the server (always returns false with no ajax request). Perhaps I am missing something? – Kyle Jul 31 '12 at 13:20
I'm going to mark your response as the answer, but leave this comment for anyone else that might come across this (and for myself). After re-reading this a few times, it suddenly hit me. Despite me using `$.extend($.jgrid.edit, editParams);`, this doesn't override the edit parameters for ALL editing. Also, calling `editRow` does not use the default `editUrl` parameter defined in initialization or the extended `$.extend` mentioned above. If I am wrong in any of this, please correct me as I was under the impression that extending `jgrid.edit` and supplying an `editUrl` would work here. – Kyle Jul 31 '12 at 15:04
One last thing. The final solution to my problem came from Oleg's answer here: http://stackoverflow.com/a/10887652/880685 – Kyle Jul 31 '12 at 15:19

jqGrid - Saving an Inline Edit not working

1 Answers1