Refresh a jqxgrid with Server Paging in PHP

[tamaraOntMember]

Hi, I have a grid with server paging in php. It works perfectly, loading the data from the server under demand, but I have a problem.

When I insert a new record in the database, I don’t know how to refresh the grid to reflect the changes. I’ve tried doing as the same way as in a normal grid, but It doesn’t work.

When I came back from the server, I call the following method.

function refreshGrid(resource, container){
    
     var source =$('#gridUser').jqxGrid('source');
     
     var url = _URL_BASE_  +"/"+resource;
     $.get(url ,{grid: true},function(result){   
        var data = result['data'];  
        source.localdata = data;
        var dataAdapter = new $.jqx.dataAdapter(source);
        $('#gridUser').jqxGrid({ source: dataAdapter });
        $('#gridUser').jqxGrid('updatebounddata');
    });
}

The grid is constructed with the following code:

  var theme = 'ui-redmond';
    var url = _URL_BASE_  +"/"+resource;
    var structureColumns = new Array();      
    var source = {
        datatype: "json",
        url: url,
        data:{gridLazy:true},
        root: 'data',
        cache: false,
            beforeprocessing: function(data){		
                source.totalrecords = data.numRows;               
                var j=0;
                for (var i=0;i<data.structure.length; i++){
                    var columns = new Object();
                    columns['text']= data.structure[i].name;
                    columns['datafield']= data.structure[i].name;
                    columns['filtertype'] = parseFilterTypes(data.structure[i].type);
                    if (isApplicableCellFormat(data.structure[i].type=="int")){
                        columns['cellsformat'] = parseCellsFormat(data.structure[i].type);
                    }  
                    structureColumns[j] = columns;
                    j++;
                }
            }
    };		
    var dataAdapter = new $.jqx.dataAdapter(source);
     $('#gridUser').jqxGrid({
        width: 600,
        source: dataAdapter,
        theme: theme,
        pageable: true,
        autoheight: true,
        virtualmode: true,
        rendergridrows: function(){
            return dataAdapter.records;     
        },
        columns:structureColumns
    }); 
     $('#gridUser').jqxGrid('autoresizecolumns');

Thanks in advance

[Peter StoevKeymaster]

Hi,

var source =$(‘#gridUser’).jqxGrid(‘source’); will return a dataAdapter instance which does not have a “localdata” field. I suppose that in your scenario, you should either make your server calls through the jqxDataAdapter or to build a source object and create a jqxDataAdapter from it as shown in this sample: bindingtoarray.htm.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts