Skip to content

# State Persistence

Step1: Include JS / CSS files required to have this feature. Make sure you include JS files after jQuery JS inclusion.

    <!-- library for persistance storage -->
    <script src="//cdn.jsdelivr.net/jstorage/0.1/jstorage.min.js" type="text/javascript"></script>
    <script src="//cdn.jsdelivr.net/json2/0.1/json2.min.js" type="text/javascript"></script>
    <script src="//cdn.jsdelivr.net/gh/gridphp/jqGridState@10b365046ebd687914855e807eb5f769277317d5/jqGrid.state.js" type="text/javascript"></script>

Step2: Before displaying grid echo $out, set persistence options in script tag:

    <script>
    var opts_list1 = {
        "stateOptions": {
                    storageKey: "gridState-list1",
                    columns: true, // remember column chooser settings
                    selection: true, // row selection
                    expansion: true, // subgrid expansion
                    filters: true, // filters
                    pager: true, // page number
                    order: true // field ordering
        }
    };
    </script>

- Set true/false setting in JS object you want to keep persistence on page reload.
- If you have single grid on page, `var opts` will also work. However it's better to use `var opts_<gridid>`
- Option `storageKey` should be unique for each grid, otherwise settings will mix-up.
- It uses client side browser storage. To persist on server, refer demo code below.

### Resources

- Sample Code
- See Live Demo
- You can check this demo in archive `demos/misc/persist-settings.php`