0
votes

I am trying to use this following code in my application to retain the current state of my application even after it is refreshed.

Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

But after executing above code, It's not working for me.

Kindly suggest any way to do this as, I am new to ExtJs

Thanks.

1
That simply tells ExtJs where to store the state. I recommend you to look at the documentation and the kitchen sink examples - nicholasnet

1 Answers

0
votes

You need to define this in the Launch function of your application or init of controller. Its critical to use expires when using state provider.

init : function() {
        Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
            expires : new Date(Ext.Date.now() + (1000*60*60*24*90)) // 90 days
        }));
    }

Then based on what components state you are trying to save set its stateful property to true, alternatively giving it a stateId.

Below is example to save state of grid:

Ext.define('MyApp.view.Users', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.users_grid',
    title: 'Users',
    stateful:true,
    stateId:'users_grid_stid',
    store:{
        data:[
            {
                first_name:'Joe',
                last_name:'Blogs'
            }
        ]
    },
    columns: {
        items: [
            {
                xtype: 'gridcolumn',
                dataIndex: 'first_name',
                text: 'First Name',
                width: 200
            },
            {
                xtype: 'gridcolumn',
                dataIndex: 'last_name',
                text: 'Last Name',
                width: 200
            }
        ]
    }
});

You can test this by modifying the width of one of the columns on this grid and then that column will be hold the modified width when you next load the page, even after browser restart. Check F12 Console -> Application Cookies for saved component states.