How to close form and reload grid after submit in jqgrid?

Question

I found many response about my question and do that correctly, but as somebodies have such problem, my problem does not solved. i.e. my form does not disappear after click on submit button. I use this code: (I guess my problem is tiny but i can not solve it, Please help me)

$(function(){
$("#grid").jqGrid({
url:'example.php',
datatype: 'xml',
mtype: 'POST',
colNames:['Inv No','Date', 'Amount','Tax','Total','Notes'],
colModel :[ 
  {name:'invid', index:'invid', width:55, align: 'center'}, 
  {name:'invdate', index:'invdate', width:90, align: 'center'}, 
  {name:'amount', index:'amount', width:80, align:'center',editable: true}, 
  {name:'tax', index:'tax', width:80, align:'center',editable: true}, 
  {name:'total', index:'total', width:80, align:'center'}, 
  {name:'note', index:'note', width:150, sortable:false} 
],
height: 'auto',
width: 'auto',
editurl: "edit.php",
pager: '#pager',
rowNum:10,
cellEdit: true,
cellsubmit: 'remote',
cellurl: 'edit.php',
ondblClickRow: function(id, status) {
    //var pageNumber = jQuery("#grid").getGridParam('rowNum');
    //jQuery("#grid").editGridRow(id);
    alert(id);
},
afterSubmitCell: function(response) {
    if(response.responseText == "ERROR")
        alert('Zekki');
},
beforeSubmitCell: function() {
    alert('before'); 

},
rowList:[10,20,30],
sortname: 'invid',
sortorder: 'asc',
viewrecords: true,
gridview: true,
caption: 'My first grid',
multiselect: true,
multikey: 'ctrlKey',
toolbar: [true,'bottom'],
loadComplete: function () {
    //alert("OK");
},
loadError: function (jqXHR, textStatus, errorThrown) {
    alert('HTTP status code: ' + jqXHR.status + '\n' +
          'textStatus: ' + textStatus + '\n' +
          'errorThrown: ' + errorThrown);
    alert('HTTP message body (jqXHR.responseText): ' + '\n' + jqXHR.responseText);
}
}).navGrid('#pager',{edit:true,add:true,del:true},
    {
        afterSubmit:processAddEdit,
        closeAfterAdd: true,
        closeAfterEdit: true,
        reloadAfterSubmit:true,
    }, 
    {
        afterSubmit:processAddEdit,
        closeAfterAdd: true,
        closeAfterEdit: true,
        reloadAfterSubmit:true,
    }, 
    {
        afterSubmit:processAddEdit,
        closeAfterAdd: true,
        closeAfterEdit: true,
        reloadAfterSubmit:true
    }).filterToolbar();
function processAddEdit(response, postdata) {
    alert("* "+response.responseText+" *");
}
    /*var pageNumber = jQuery("#grid").getGridParam('page');
    var rowNumber = jQuery("#grid").getGridParam('rowNum');
     */

});

Thanks Best Regards

score 0 · Answer 1 · answered Jun 14 '12 at 22:36

You should return something from your afterSubmit call back function.

Something like:

function processAddEdit(response, postdata) {
    alert("* "+response.responseText+" *");
    if (everything_is_ok)
        return [true,"",new_id];
    else
        return [false,"Some error happened",null];
}

See trirand wiki.

score 0 · Answer 2 · edited Oct 11 '12 at 08:52

0

I had a similar problem but tried closing the form manually, I'm sure this is not the best thing to do but it works anyway.

Try adding this to the code

function processAddEdit(response, postdata) {
   alert("* "+response.responseText+" *");
   $(".ui-icon-closethick").trigger('click');
}

It is better to evaluate whether there is no error before closing the form anyway.

edited Oct 11 '12 at 08:52

Stephan

41,764
65
238
329

answered Jul 28 '12 at 06:15

Simeon Abolarinwa

1,632
2
11
13

How to close form and reload grid after submit in jqgrid?

2 Answers2

Linked