Tuesday, January 31, 2012

jqgrid - close form dialog


I am using jqgrid 4.3.1 and I am using form editing with local data. The problem is the form does not close after adding or editing. Here is my code.




$('#studentset').jqGrid({
data: mydata,
datatype: "local",
colNames:['id','First Name', 'Last Name'],
colModel:[
{name:'id',index:'id', width:60},
{name:'firstName',index:'fName', width:300, editable:true},
{name:'lastName',index:'lastName', width:300, editable:true}
],
pager: '#pager',
rowNum: 10,
rowList: [5, 10, 20],
sortname: 'id',
sortorder: 'asc',
viewrecords: true,
height: "80%",
caption: "Students to be Registered",
editurl: corpUrl
});
$('#studentset').jqGrid('navGrid', '#pager', { add: true, edit: true, del: false, search: false, refresh: false },
{
recreateForm: true,
closeAfterEdit: true,
modal:true,
afterSubmit: function(data){
var myObject = eval('(' + data.responseText + ')');
$('#studentset').setGridParam({data: myObject}).trigger("reloadGrid");
}
},
{
recreateForm: true,
closeAfterAdd: true,
modal:true,
afterSubmit: function(data){
var myObject = eval('(' + data.responseText + ')');
$('#studentset').setGridParam({data: myObject}).trigger("reloadGrid");
}
},
{},{},{}
);



Notice in the edit and add options of the navGrid I have specified the relevant options. closeAfterAdd: true, and closeAfterEdit: true . But the modal form simply refuses to close. I am not sure if its a bug in this version of jqgrid.



Can someone please offer some guidance? May be, how to close the dialog manually?

1 comment:

  1. Ok so its logical, simply trigger the click event of the dialog close button like this. You will find the ID of the span tag using fire bug.

    $('#studentset').jqGrid('navGrid', '#pager', { add: true, edit: true, del: false, search: false, refresh: false },
    {
    modal:true,
    jqModal: true,
    afterSubmit: function(data){
    var myObject = eval('(' + data.responseText + ')');
    $('#studentset').setGridParam({data: myObject}).trigger("reloadGrid");
    $(".ui-icon-closethick").trigger('click');
    }
    },
    {
    modal:true,
    jqModal: true,
    afterSubmit: function(data){
    var myObject = eval('(' + data.responseText + ')');
    $('#studentset').setGridParam({data: myObject}).trigger("reloadGrid");
    $(".ui-icon-closethick").trigger('click');
    }
    },
    {},{},{}
    );


    Hope someone benefits from this.

    ReplyDelete