jqGrid inline edit: how to save again if post retu

2019-01-27 08:51发布

问题:

This question already has an answer here:

  • Prevent restoring row if error was rised while editing 2 answers

jQgrid row is edited using inline editing mode. Pressing Enter sends data to server using http POST . POST method returns status 400 Bad reguest if there was some error. errorofunc in code below show error in this case. User corrects data in row and presses enter again.

Pressing enter is ignored, nothing happens. It looks like Enter key is unbound if 404 error is returned. Changes in edited row are lost, they cannot saved.

I tried to set in errorfunc

restoreAfterError = false; grid.restoreAfterErorr = false;

but row still cannot saved again after error.

How to allow to save correct row data after 400 error is returned ?

<script type="text/javascript">
var lastSelectedRow;
$(function () {
            var grid = $("#grid");
            grid.jqGrid({
                url: '/Grid/GetData',
                datatype: "json",
                mtype: 'POST',
                scroll: 1,
                multiselect: true,
                multiboxonly: true,
                scrollingRows : true,
                autoencode: true,
                colModel: [
        { name: 'Source', fixed: true, editable: true, width: 30 },
        { name: 'Est', fixed: true, editable: true, width: 271 },
        { name: 'Istopic', fixed: true, editable: true, width: 57 },
        {name: 'Critical', fixed: true, editable: true, width: 50}
    ],

                gridview: true,
                pager: '#pager',
                sortname: 'est',
                viewrecords: true,
                rowNum: 30,
                sortorder: "asc",
                editurl: '/Grid/Edit'
            });

            $("#grid").jqGrid('bindKeys', {
                onEnter: function(rowid) {
                    doeditRow(rowid);
                }
            }  );

        });

        function doeditRow(rowID) {
            var grid2 = $("#grid");
            if (rowID && rowID !== lastSelectedRow) {
                grid2.jqGrid('restoreRow', lastSelectedRow);
                lastSelectedRow = rowID;
            }
            invokeEditRow();
        }

        function errorfunc(rowID, response) {
            // todo: why this does not allow Enter key to continue ase after error:
            restoreAfterError = false;
            $("#grid").restoreAfterErorr = false;
            alert(response.responseText);
            lastSelectedRow = rowID;
            invokeEditRow();
            return true;
        }


        function invokeEditRow() {
             $("#grid").jqGrid('editRow', lastSelectedRow ,true,null, null, null, {},
                 null,
                 errorfunc
             );
        }
    </script>

<div id="grid1container" style="width: 100%;">
    <table id="grid">
    </table>
    <div id="pager">
    </div>
</div>

UPDATE: errrofunc calls editrow which according to https://github.com/tonytomov/jqGrid/blob/master/js/grid.inlinedit.js should set enter key again to save. For unknown reason this does not occur.

UPDATE: in errorfunc grid. is changed to

        $("#grid").restoreAfterErorr = false;

according to Oleg comment

回答1:

You use variable grid inside of errorfunc implementation (grid.restoreAfterErorr). The grid is undefined and you have exception in the line.

UPDATED: ou should replace alert(response.responseText); to

$.jgrid.info_dialog($.jgrid.errors.errcap,'<div class="ui-state-error">'+
    response.responseText +'</div>', $.jgrid.edit.bClose,{buttonalign:'right'});

to see the same styled dialog box as in the standard case. The errorfunc from the inline editing is responsible to display the error message itself.



标签: jquery jqgrid