jQuery UI Widgets Forums Grid Grid savestate

This topic contains 6 replies, has 4 voices, and was last updated by  usrimas 10 years, 3 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • Grid savestate #18197

    naatha
    Member

    Hello,

    Is it possible to save different states of the same grid by different names

    and later on load the states by selecting the desired states?

    Thanks

    Grid savestate #18198

    Dimitar
    Participant

    Hello naatha,

    Yes, it is possible. Here is how:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.pager.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.sort.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.filter.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.storage.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.columnsresize.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.columnsreorder.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxpanel.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {
    var theme = getDemoTheme();
    var url = "../sampledata/orders.xml";
    // prepare the data
    var source =
    {
    datatype: "xml",
    datafields: [
    { name: 'ShipName', map: 'm\\:properties>d\\:ShipName' },
    { name: 'ShipCity', map: 'm\\:properties>d\\:ShipCity' },
    { name: 'ShipCountry', map: 'm\\:properties>d\\:ShipCountry' }
    ],
    root: "entry",
    record: "content",
    id: 'm\\:properties>d\\:OrderID',
    url: url,
    pager: function (pagenum, pagesize, oldpagenum) {
    // callback called when a page or page size is changed.
    }
    };
    var dataAdapter = new $.jqx.dataAdapter(source);
    $("#jqxgrid").jqxGrid(
    {
    width: 670,
    source: source,
    theme: theme,
    selectionmode: 'multiplerowsextended',
    sortable: true,
    pageable: true,
    autoheight: true,
    autoloadstate: false,
    autosavestate: false,
    columnsresize: true,
    columnsreorder: true,
    showfilterrow: true,
    filterable: true,
    columns: [
    { text: 'Ship Name', filtercondition: 'starts_with', datafield: 'ShipName', width: 250 },
    { text: 'Ship City', datafield: 'ShipCity', width: 200 },
    { text: 'Ship Country', datafield: 'ShipCountry' }
    ]
    });
    $("#saveState").jqxButton({ theme: theme });
    $("#saveState2").jqxButton({ theme: theme });
    $("#loadState").jqxButton({ theme: theme });
    $("#loadState2").jqxButton({ theme: theme });
    var state = null;
    $("#saveState").click(function () {
    // save the current state of jqxGrid.
    state = $("#jqxgrid").jqxGrid('savestate');
    });
    $("#saveState2").click(function () {
    // save the current state of jqxGrid.
    state2 = $("#jqxgrid").jqxGrid('savestate');
    });
    $("#loadState").click(function () {
    // load the Grid's state.
    if (state) {
    $("#jqxgrid").jqxGrid('loadstate', state);
    }
    else {
    $("#jqxgrid").jqxGrid('loadstate');
    }
    });
    $("#loadState2").click(function () {
    // load the Grid's state.
    if (state2) {
    $("#jqxgrid").jqxGrid('loadstate', state2);
    }
    else {
    $("#jqxgrid").jqxGrid('loadstate');
    }
    });
    });
    </script>
    </head>
    <body class='default'>
    <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
    <div id="jqxgrid">
    </div>
    <div style="margin-top: 30px;">
    <input type="button" id="saveState" value="Save State" />
    <input type="button" id="saveState2" value="Save State 2" />
    <input type="button" id="loadState" value="Load State" />
    <input type="button" id="loadState2" value="Load State 2" />
    </div>
    </div>
    </body>
    </html>

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Grid savestate #18200

    naatha
    Member

    Hi Dimitar,

    Thanks for your quick replay.

    I want to allow the user to save their different grid setting by different name, like MySetting1, MySetting2….to a folder.

    Later on the user can load the setting by selecting the names.

    Is it possible?

    thanks

    Grid savestate #18205

    Dimitar
    Participant

    Hi naatha,

    Saving different states to different variables is the only way of having multiple saved states of a grid.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Grid savestate #20640

    jim
    Member

    Hi,

    Is there a way to save the state and then load it the next time the page is loaded via a cookie? I’m able to get your sample above working, but need to save and reload the state when the page is reloaded.

    Jim

    Grid savestate #50353

    usrimas
    Participant

    Hi,

    Can savestate/loadstate be done to/from database ( mysql ) ? As I can understand , then user save own state , it save to local pc. But with pc, user can’t get the saved state . I’m prefering database , because it can be more flexible …

    With best regards !

    Grid savestate #50354

    usrimas
    Participant
Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.