Thursday, September 8, 2011

stateful example in extjs [saving tree selection in extjs]

First read this:  http://dev.sencha.com/deploy/ext-4.0.2a/docs/#/api/Ext.state.Stateful-cfg-stateful
Following example demonstrate simple way to save a selected item in tree:

       

           this.tree = Ext.create(‘Ext.tree.Panel’, {
    viewConfig: {
        plugins: {
            ptype: ‘treeviewdragdrop’,
            appendOnly: true
        }
    },
    height: 350,
    width: 400,
    stateEvents: ['saveSelectedItem'],
    stateId:’myTreeId’,
    stateful:true,
    rootVisible: false,
    mySelectedItem:”,//my own added Variable
    getState : function () {
        /*this is place where we state what things are to be saved*/
        console.log(‘saving’+this.mySelectedItem);
        /*we return thing to be save in format key:value*/
        return {
            mySelectedItem: this.mySelectedItem
        }
    },
    applyState : function (state) {
        /*this is place where we recover the saved state*/
        console.log(state);
        console.log(“Previosuly selected “+state.mySelectedItem);
     },
    listeners:{
       itemclick:{fn:function (view, record, item, index, even) {
            console.log(“saving item:”+record.data.text);
            this.mySelectedItem =  record.data.text;
            this.fireEvent(‘saveSelectedItem’);
       }}
    }});

       
 

No comments:

Post a Comment