How to set combo's options/ Store dynamically

Question

I am using itscomponentcolumn in my Grid.

I want to set different store for every user.

If in a Grid there are 4 user's , I want to set for every user different combo store so that when user click on the Combo, he will see option's depending upon his permission, OR store that I will set.

xtype: 'itscomponentcolumn',
            text : '<b>Permission</b>',
            width: 150,
            dataIndex: 'permission',
            items: function(value,record) {
            return { 
                xtype: 'combobox',
                store: [[0,'View Only'], [1,'View & Edit'], [2,'View,Edit & Delete'],[3,'No Access']],
                //store:Combo_Store,
                queryMode:'local',
                displayField: 'display',
                valueField: 'value',
                name:'permission',
                forceSelection:true,
                width: 145,
                listeners: { }

I can not attached image. Just imagine there is Grid with 5 records. Grid has 2 columns, user Name, Permission in Permission column I am showing combo , for which code I gave above.

suppose there is vivek user , if he has view only permission's then i want to show view only in the combo just next to vivek record.

Same for other user's.

I have tried to set the store using bindStore, but didn't work for me.

Please suggest me how to do this ?

after your suggestion my code is like this

xtype: 'itscomponentcolumn',
            text : '<b>Permission</b>',
            width: 250,
            sortable:false,
            dataIndex: 'permission',
            items: function(value,record) {
            return { 
                xtype: 'combobox',
                store: new Ext.data.Store({
                    proxy: {
                        type: 'ajax',
                        url: comboStoreURL+"&currenetUserId="+record.get("userId"),
                        reader: {
                            type: 'json',
                            root: 'jsonStore'
                        }
                    },
                    autoLoad: true
                }),

But Can I know why to give call server each time? i mean for every record.I guess there must be some other way to do this because I have permission in my Grid's store.

My actual Grid code is like this.

var store = Ext.create('Ext.data.Store', 
            {
                storeId: 'ShareComponentStoreId', 
                fields: ['userId','userName','permission','isProjectOwner'],
                 proxy: {
                    type: 'ajax',
                    url:strURL,
                    reader: 
                    {
                        root: 'rootShareGrid', 
                        totalProperty: 'totalCount'
                    },
                    writer: 
                    {
                        type: 'json', 
                        writeAllFields: false, 
                        allowSingle: false, 
                        encode: true, 
                        root: 'row'
                    } 
                }

            }); 


var shareGrid = Ext.create('Ext.grid.Panel', {
            id: 'ShareComponentGrId',
            enableColumnMove:false,
            store: store,
        columns: [
        {
            text: '<b>Name</b>',
            flex: 1,            
            sortable:false,
            width: 100,
            dataIndex: 'userName'
        },
        { 
            xtype: 'itscomponentcolumn',
            text : '<b>Permission</b>',
            width: 250,
            sortable:false,
            dataIndex: 'permission',
            items: function(value,record) {
            return { 
                xtype: 'combobox',
                store: new Ext.data.Store({
                    proxy: {
                        type: 'ajax',
                        url: comboStoreURL+"&currenetUserId="+record.get("userId"),
                        reader: {
                            type: 'json',
                            root: 'jsonStore'
                        }
                    },
                    autoLoad: true
                }),
                queryMode : 'local',
                displayField: 'display',
                valueField: 'value',
                name:'permission',
                forceSelection:true,
                width: 200,

So the record.get('permission') has that users permission.

I want to add that permission to the Combo store.

i.e. default combostore + the user's permission.

Hope I am able to explain well here.

Please reply me as early as possible on this

dbrin dbrin · Accepted Answer · 2012-06-05T18:23:32

There are several ways of doing this of course. What I would suggest is to have a Permissions store with autoLoad:true. You fetch user permissions right away and then it is available to your combobox when the grid loads.

How to set combo's options/ Store dynamically

1 Answers