1. #1
    Sencha User
    Join Date
    Oct 2012
    Posts
    4
    Vote Rating
    0
    Karthi127 is on a distinguished road

      0  

    Default ComboBox is not editable in Grid

    ComboBox is not editable in Grid


    Hi,

    I am new to ExtJS, currently I am working on creating editable grid. There is a column with combobox which is not editable when i am adding new row to the grid, please help me to make it editable. Below is the code I am using to create editable Grid. Thanks for the help.

    Code:
     Ext.require([
                    'Ext.data.*',
                    'Ext.grid.*',
                    'Ext.toolbar.Paging',                
                    'Ext.Util.*',
                    'Ext.picker.*',
                    'Ext.window.*',
                    'Ext.tip.*',
                    'Ext.form.*',
                    'Ext.EventObject',
                    'Ext.data.StoreManager',
                    'Ext.util.DelayedTask',
                    'Ext.view.BoundList',
                    'Ext.view.BoundListKeyNav'
                ]);
    
    
        
                Ext.onReady(pageInitialize);
                
                function pageInitialize(){
                    
                    
                    Ext.define('HedgeModel',{
                        extend:'Ext.data.Model',
                        fields:[
                            {name:'accountsubtype',type:"string"},
                            {name:'accountNumber',type:"string"}
                        ]
                    });
                    
                     hedgeStore=Ext.create('Ext.data.Store',{
                        model:'HedgeModel',
                        storeId:'HedgeStore'
                    });
                    
                    var cellEditing=Ext.create('Ext.grid.plugin.CellEditing',{
                        clicksToEdit:1
                    });
                    
                    
                    
                   var grid=Ext.create('Ext.grid.Panel',{
                       store:hedgeStore,
                       columns: [{
                               header:'Account Type',
                               dataIndex:'accountsubtype',
                               width:130,
                               editor: new Ext.form.field.ComboBox({
                                   typeAhead:true,
                                   triggerAction:'all',
                                   editable:true,
                                   selectOnTab:true,
                                   store:['Shade','Share'],
                                      
                                   
                                   lazyRender:true,
                                   listClass:'x-combo-list-small'
                               })
                       },{
                            id:'accountNum',
                            header:'Account Number',
                            dataIndex:'accountNumber',
                            flex:1,
                            editor:{
                                allowBlank:false
                            }
                       },{
                           xtype:'actioncolumn',
                           width:30,
                           sortable:false,
                           items:[{
                                   icon:'../resources/images/delete.png',
                                   tooltip:'Delete Row',
                                   handler: function(grid,rowIndex,colIndex)
                                   {
                                       hedgeStore.removeAt(rowIndex);
                                   }
                           }]
                       }],
                       selModel:{
                                selType:'cellmodel'
                       },
                       renderTo:'resultGrid',
                       width:600,
                       height:300,
                       title:'Add Accounts To This Template',
                       frame:true,
                       tbar:[{
                           text:'Add Account',
                           handler: function(){
                               alert("Function Started");
                               var r=Ext.create('HedgeModel',{
                                   accountsubtype:'Share',
                                   accountNumber:''
                               });
                               alert("Record created");
                               hedgeStore.insert(0,r);
                               alert("Record inserted");
                               cellEditing.startEditByPosition({row:0,column:0});
                           }
                       }],
                   plugins:[cellEditing]
                   }); 
                   
                  
                    
                }
    Last edited by scottmartin; 8 Oct 2012 at 10:00 AM. Reason: Please format code

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,910
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Can you specify the version of Ext that you are using?

    Scott.

  3. #3
    Sencha User
    Join Date
    Oct 2012
    Posts
    4
    Vote Rating
    0
    Karthi127 is on a distinguished road

      0  

    Default ComboBox is not editable in Grid

    ComboBox is not editable in Grid


    Thanks Scott. I am using version 4. (Not sure how to confirm the version, in ext-all.js it is mentioned as 4.)

  4. #4
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,910
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Please see the following example:
    http://jsfiddle.net/5NDH8/

    Scott.

  5. #5
    Sencha User
    Join Date
    Oct 2012
    Posts
    4
    Vote Rating
    0
    Karthi127 is on a distinguished road

      0  

    Default ComboBox is not editable in Grid

    ComboBox is not editable in Grid


    Thanks Scott. It worked. Thanks for the help. could you please tell me if there is any article for implementing auto complete in combobox. The combobox list will be fetched from the server for every inout character from user.

  6. #6
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,910
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Have a look at this example. This is handled automatically an defaults to 4 chars before searching:

    http://dev.sencha.com/deploy/ext-4.1...um-search.html

    Scott.

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."