jqGrid Add/Edit from navGrid not working

Question

I've implemented a basic jqGrid table using jqGrid 4.5.2, I added 'add', 'edit', 'delete' buttons on navGrid.

Using either 'add' or 'edit' buttons generates a modal where I add/edit values for a row. After clicking submit my controller is called successfully but no new row is added/edited inside the table.

javascript

jQuery(grid_selector).jqGrid({
    data: grid_data,
    datatype: "local",
    colNames:[' ', 'Col1','Col2', 'Col3', 'Col4'],
    colModel: modelArray,
    editurl: "editController"
});

//navButtons
jQuery(grid_selector).jqGrid('navGrid',pager_selector,
    {   //navbar options
        edit: true,
        add: true,
        del: true,
    },{   //edit record form
        recreateForm: true
    },{   //new record form
        closeAfterAdd: true,
        recreateForm: true,
        viewPagerButtons: false
    },{   //delete record form
        recreateForm: true
    }
);

Java Controller

String action = request.getParameter("oper");
Map<String, String[]> parameterMap = request.getParameterMap();
switch (action) {
          case "del":
                    String ids = request.getParameter("id");
                    deleteEmployee(ids);
                    break;
          case "edit":
                    RowData row = generateObjFromMap(parameterMap);
                    editRow(row);
                    break;
          case "add":
                    RowData row1 = generateObjFromMap(parameterMap);
                    row1 = saveRow(row11);
                    break;
            }
 }
 out.print("Success");

Works:

• delete selected row(s)
• search

Doesn't work:

• adding new row (although controller is called)
• edit selected row (although controller is called)

Why isn't the table being updated on add/edit?

Answer 1

The combination datatype: "local" and remote editing editurl seems me strange. I would recommend you to add

reloadAfterSubmit: false

option to both Add and Edit settings. It will prevent default reloading the grid.