Question

Referring to a slightly modified version of a jqGrid local editing demo by user @Oleg located here: http://www.dataactive.net/local_editing.htm
…after one row is deleted using either the rubbish bin icon in the lower toolbar or the Delete button on the top toolbar, the following error is given in Firebug:
“NetworkError: 404 Not Found – http://www.dataactive.net/clientArray”

@Oleg are you able to ascertain why this happens?

Now that that problem is solved with the row deletion, something else I observe (keeping in mind this is editing “local data”), when newly added rows are deleted they don’t seem to vanish. Consider the myDelOptions code from your demo (@Oleg) which I’m trying to use in another script for a production purpose:

myDelOptions = {
    // because I use "local" data I don't want to send the changes
    // to the server so I use "processing:true" setting and delete
    // the row manually in onclickSubmit
    onclickSubmit: function (options, rowid) {
        var grid_id = $.jgrid.jqID(grid[0].id),
            grid_p = grid[0].p,
            newPage = grid_p.page;

        // reset the value of processing option to true to
        // skip the ajax request to 'clientArray'.
        options.processing = true;

        // delete the row
        grid.delRowData(rowid);
        $.jgrid.hideModal("#delmod" + grid_id,
                          { gb: "#gbox_" + grid_id,
                              jqm: options.jqModal, onClose: options.onClose
                          });

        $("#list")[0].refreshIndex();

        setTimeout(function () {
            $("#list").trigger("reloadGrid", [{ current: true}]);
        }, 100);

        calculateTotal();

        if (grid_p.lastpage > 1) {// on the multipage grid reload the grid
            if (grid_p.reccount === 0 && newPage === grid_p.lastpage) {
                // if after deliting there are no rows on the current page
                // which is the last page of the grid
                newPage--; // go to the previous page
            }
            // reload grid to make the row from the next page visable.
            grid.trigger("reloadGrid", [{ page: newPage}]);
        }

        return true;
    },
    processing: true
};

the calculateTotal() function which iterates through the row object, simply takes the numeric values of the columns of the rows that remain and re-totals them to a summary footer row but what is happening is that iterating through the row object of the grid shows the “deleted” rows are still there, in the array or something, and so a new total cannot be calculated because nothing seems to have changed, the rows are not actually deleted. I don’t understand what actually happens when “delRowData” is used in context of local data but it appears to only “remove” the row from the visual grid but it is still part of the row object. And, stranger yet, if another new row is added, the “deleted” row(s) re-appear exactly as they were in addition to the new row. As you can see I have refreshIndex[0] and trigger(reload) but the row does not delete if trigger("reload") is there and refreshIndex[0] has no effect. Can anyone address any of this? Additional code required?

Answer 1

You are right. Thank you! The trick on the example is to set processing: true as the part of myDelOptions. At the first delete operation is everything OK, but the value will be reset to processing: false by another part of the delGridRow method at the second call of it.

The fix of the problem is very easy: one should just add additional line

options.processing = true;

inside of the onclickSubmit of the myDelOptions. See the modified demo here.