papski
papski

Reputation: 1281

How to display data in grid from combo box

My problem is that how can I put the data to the grid when I select it from the combo box

This is what I've tried so far,

 var store = new Ext.data.JsonStore({
                proxy: new Ext.data.HttpProxy({
                        url: '/index.php/getAnimals'
                    }),
                    root: 'data',
                    pruneModifiedRecords: true,
                    totalProperty: 'total',
                    baseParams: {limit: 25},
                    autoLoad: {params: {start: 0}},
                    fields: ['id','animal_name'],
                    sortInfo: {field:'id', direction:'ASC'}
            });






                var grid = new Ext.grid.EditorGridPanel({
                id: 'editorgrid',
                store: store1,
                title: 'Animals',
                cm: cm1,


                width: 400,
                anchor: '100%',
                height: 700,

                frame: true,
                loadMask: true,
                waitMsg: 'Loading...',
                clicksToEdit: 1,
                tbar: [
                'Animals Unit  : ', '-',               

                {
                xtype: 'combo',
                name: 'company_combo',

                anchor: '90%',
                allowBlank: false,
                editable: false, 
                forceSelection: true,
                triggerAction: 'all',
                mode: 'remote',
                store: new Ext.data.JsonStore({
                    url: '/index.php/getAnimalsCombo',
                    root: 'data',
                    totalProperty: 'total',
                    fields: ['id','desc'],
                    params: {start: 0},
                    baseParams: {limit: 25}
                }),
                pageSize: 25,
                displayField: 'desc',
                valueField: 'id',
                minListWidth: 150,
                valueNotFoundText: '',
                width: 150,
                minChars: 1

                },

                '-',

              ],                
            bbar: pager1
            });

Upvotes: 0

Views: 142

Answers (1)

martskins
martskins

Reputation: 2940

You should set the listeners for the combo... something like this

{
                xtype: 'combo',
                name: 'company_combo',
                listeners:{
                    "select":function(theCombo, selectedRecord){
                         var theGrid = theCombo.up("grid");
                         theGrid.reconfigure(newStore, newColModel);
                     }
                },
                anchor: '90%',
                allowBlank: false,
                editable: false, 
                forceSelection: true,
                triggerAction: 'all',
                mode: 'remote',
                store: new Ext.data.JsonStore({
                    url: '/index.php/getAnimalsCombo',
                    root: 'data',
                    totalProperty: 'total',
                    fields: ['id','desc'],
                    params: {start: 0},
                    baseParams: {limit: 25}
                }),
                pageSize: 25,
                displayField: 'desc',
                valueField: 'id',
                minListWidth: 150,
                valueNotFoundText: '',
                width: 150,
                minChars: 1

                },

You probably want to check the ExtJS documentation, here's a link to the docs on grids

http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.grid.Panel

You should also look for combos in there

Upvotes: 1

Related Questions