Question

After long searches, I succeed to delete a row in a jqgrid with form editing.

But, there are two little things left :

• How to reload the grid with the row deleted ?
• If the row can’t be deleted, how to display the information and the reason why ?

I tried to search in the arguments passed to the function in the event “afterSubmit”, but there is no real explanations about how to manipulate these arguments.

The creation of the grid :

tableToGrid("#TabUser", {
    caption: 'Gestion des Utilisateurs',
    width: 'auto',
    height: "auto",
    hidegrid: false,
    pager:'#DivUser',
    rowNum:10,
    cellEdit: true,
    cellsubmit: 'remote',
    cellurl: 'Adminuser',
    colModel: [{name:'Id', editable:false, width:50},
               {name:'Login', editable:false, width:150},
               {name:'Nom', editable:true, width:200},
               {name:'Prénom', editable:true, width:200},
               {name:'Rôle', editable:true, width:80, edittype:'select', 
                editoptions: { multiple: false, value:{ADMIN:'ADMIN',GUEST:'GUEST'}}},
               {name:'Email', editable:true, width:200}],
    beforeSubmitCell: function(rowid, celname, value, iRow, iCol) {
        var rowData = jQuery(this).getRowData(rowid); 
        var idUser= rowData['Id'];// On récupère l'Id du user en cours d'édition
        return {idUser:idUser}; }

});

The navigation :

$("#TabUser").navGrid('#DivUser',
        {edit:false,add:false,del:true,search:false},{}, {},
        {width:500, url:'Adminuser',
            reloadAfterSubmit:true,
             onclickSubmit: function(param){ 
                var sr = jQuery('#TabUser').getGridParam('selrow');
                var idUser = jQuery('#TabUser').getCell(sr,'Id');
                return {idUser:idUser}; },
            afterSubmit: function(reponse, data) {
                $("#TabUser").trigger('reloadGrid');
                $("#eData").click(); // clic sur "Annuler"
                return [true,"Supression réussie"];
            }
        });

What are the values of “response” and “data” ?
How to reload the grid ?

The row is effectively deleted in the database with the url ‘Adminuser’ (written in java).

Answer 1

I think that your real problem is not reloading of the grid after deleting of the row. The grid which will be created by tableToGrid have datatype: 'local' and reloading of data from the server not needed.

Your real problem is the bug in jqGrid 3.4.1 which is fixed (see here) in the code of jqGrid. So the deleted row will be not removed from the grid. The problem is the line of code:

toarr = postdata.split(",");

The bug is that postdata is already array and not the string. So one get exception in the line and the next lines which delete the row from the grid will be not executed. To fix the problem you can either use the last version of the jqGrid code from the github or to modify the above line (it has line number 8282 in jquery.jqGrid.src.js) to

toarr = postdata;

or download the modified version of jquery.jqGrid.src.js here. After that you can remove the line with $("#TabUser").trigger('reloadGrid'); from your code and all will work correctly: see the demo.

To report the error information from the server in the “Delete” of the row you should just set error status code in the HTTP response. You can additionally define the errorTextFormat callback which reformat the server response to the HTML code fragment which you want to display as the error message. See the answer, this one or this for additional information.