jQuery UI Widgets Forums Grid Load & Unloading the grid example

This topic contains 1 reply, has 2 voices, and was last updated by  Peter Stoev 11 years ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • Load & Unloading the grid example #15838

    jas-
    Member

    I would like to see a good example of loading & unloading the grid (while refreshing its data source). Currently I am doing it like the following:

    $("#current-inventory").bind('collapse', function(event, ui) {
    $("#jqxgrid").jqxGrid('destroy');
    });
    $("#current-inventory").bind('expand', function(event, ui) {
    _load();
    });
    function _load()
    {
    $.ajax({
    data: {'key':'value'},
    url: 'http://server.com/path/to',
    success: function(){
    _display($(this));
    }
    });
    }
    function _display(obj)
    {
    var source = {
    localdata: obj,
    sort: customsortfunc,
    datafields:[
    { name: 'Computer', type: 'string' },
    { name: 'SKU', type: 'string' },
    { name: 'Serial', type: 'string' },
    { name: 'UUIC', type: 'string' },
    { name: 'MSerial', map: 'Monitor>0>Serial', type: 'string' },
    { name: 'MSKU', map: 'Monitor>0>SKU', type: 'string' }
    ],
    datatype: "json"
    };
    var dataAdapter = new $.jqx.dataAdapter(source);
    $("#jqxgrid").jqxGrid({
    autoshowloadelement: true,
    width: '100%',
    altrows: true,
    source: dataAdapter,
    autoheight: true,
    columns: [
    { text: 'Hostname', datafield: 'Computer', width: '20%' },
    { text: 'SKU', datafield: 'SKU', width: '20%' },
    { text: 'Serial', datafield: 'Serial', width: '20%' },
    { text: 'UUIC', datafield: 'UUIC', width: '10%' },
    { text: 'Monitor Serial', datafield: 'MSerial', width: '20%' },
    { text: 'Monitor SKU', datafield: 'MSKU', width: '10%' }
    ]
    });
    }

    It loads the first time, but on subsequent loads I receive errors regarding the current area being unavailable.

    • This topic was modified 11 years ago by  jas-. Reason: added syntax wrapping
    Load & Unloading the grid example #15841

    Peter Stoev
    Keymaster

    Hi jas-,

    The “destroy” method completely removes the Grid from the DOM. If you want to use that approach, you should add a DIV tag to the DOM for the Grid again.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.