CODEWITHSUNDEEP
jqueryjqgrid
Saint Dee
Saint Dee

Reputation: 1015

jqGrid reload other grids after edit

first, I apologize for my english.

I have 4 grids displaying data from different sql query results. They are categorized by their status. All the grids are working fine but there's one thing that I want to do but I just can't figure out how to do it. I wanted the other grids to refresh after successful edit. jqGrid only refreshes the current grid i'm currently editing, which is good, but I ended up refreshing the entire page to see the changed item on the other grid.

I have used .trigger("reloadGrid"); but this doesn't seem to work.

How can i achieve this? please help. many thanks.

This is the jqGrid:

$('#diag').jqGrid({
        url: 'ajax/ajax-diag.php',
        data: 'xml',
        mtype: 'GET',
        colNames: ['Job', 'Client', 'Status', 'Notes'],
        colModel: [
            { name: 'jobnumber', index:'jobnumber', align:'center', width: 70, editable:true},
            { name: 'clientid', index:'clientid', align:'center', width: 70, editable:true  },
           { name: 'statuslabel', index:'statuslabel', align: 'center', width: 125, editable:true},            
            { name: 'notes', index: 'notes', align: 'center', editable: true }
        ],
        loadComplete: function() {

            if ($('#diag').getGridParam("records") == 0) {
                $('#diag').hide();              
            }            
        },        
        pagination: true,
        pager: '#diagpager',
        rowNum: 10,
        rowList: [10,20,30],
        sortname: 'jobnumber',
        width: '100%',
        height: '100%',        
        sortorder: 'desc',
        viewrecords: true,
        closeOnEscape: true,
        gridview: true,
        editurl: "ajax/ajax-edit.php",
        caption: 'Stage 1'        
    });
$('#diag').jqGrid('navGrid', '#diagpager',{},{closeAfterEdit:true},{closeAfterAdd:true});

I'm using navigator as well.

SOLVED: Thanks to Manuel van Rijn, i found the correct parameter for the navigator pager.

This is my final pager:

$('#diag').jqGrid('navGrid', '#diagpager',{},{
            closeAfterEdit:true,
            afterComplete:function() { $('#twoRec').trigger('reloadGrid')}
        },{closeAfterAdd:true});

Upvotes: 0

Views: 4521

Answers (2)

Manuel van Rijn
Manuel van Rijn

Reputation: 10315

try this

$("#gridId").jqGrid().trigger("reloadGrid");

UPDATE

$('#diag').jqGrid('navGrid', '#diagpager',{
    afterRefresh: function() {
        $("#otherGrid").jqGrid().trigger("reloadGrid");
    }
},{closeAfterEdit:true},{closeAfterAdd:true});

// above seems to work only when hitting the refresh button

UPDATE 2

$('#diag').jqGrid('navGrid', '#diagpager',{
    editfunc: function(rowId) {
        ('#grid_id').editRow(id, true, false, reloadGrids); 
    }
},{closeAfterEdit:true},{closeAfterAdd:true});

function reloadGrids() {
    $("#otherGrid").jqGrid().trigger("reloadGrid");
}

Upvotes: 1

arb
arb

Reputation: 7863

You could try this:

$('#diag').jqGrid('setGridParam', { datatype: 'xml' }).trigger('reloadGrid');

There are certain jqGrid settings that can get set that will prevent the grid from hitting the server again. One of them is datatype. Another is loadonce.

Upvotes: 1

Related Questions