1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
    jscripter is on a distinguished road

      0  

    Default GridPanel CellEditing plugin breaks when multiple columns inserted

    GridPanel CellEditing plugin breaks when multiple columns inserted


    I am trying to find the proper way to dynamically add/remove columns in a GridPanel that uses CellEditing plugin in Ext JS 4.0

    I tried to add/remove columns dynamically in a GridPanel, using the HeaderContainer add(), insert(), remove() methods as suggested in How to add columns in grid panel by clicking on add column button in extjs 4 thread

    The problem is that CellEditing plugin stops working correctly when I try to add or remove more than one column:
    1) when existing cell in edit mode the text and cursor is not visible
    2) first newly added column is not editable at all
    3) second added column is editable

    Steps to reproduce:

    1) start the page
    2) select cell in the column to insert column position before which to add new column
    3) click add column button and type Name1 in dialog press ok
    4) repeat steps 2-3 Using Name2 as column name
    5) try to edit text in existing Company column and in column Name1 and Name2

    You can find the full source code and example here:
    http://jsbin.com/otorix/edit#source
    http://jsbin.com/otorix/edit#preview

    Can you reproduce this behavior?
    Can you confirm this as bug?
    Or what am I doing wrong?

    I will be grateful for any help you can provide

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,329
    Vote Rating
    848
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Have you tried the reconfigure method on the grid?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
    jscripter is on a distinguished road

      0  

    Default


    Quote Originally Posted by mitchellsimoens View Post
    Have you tried the reconfigure method on the grid?
    yes, of course

    add column button handler:
    PHP Code:
                    handler: function(){
                        var 
    grid companyGrid;
                        
                        
    Ext.MessageBox.prompt("Specify Column Name""Column Name", function(buttoncolumnName){
                            if (
    button == "ok") {
                                
                                var 
    store grid.getStore();
                                var 
    range store.getRange();
                                var 
    rangeData = [];
                                
                                
    Ext.Array.each(range, function(itemindex, array){
                                    
    item.data[columnName] = '';
                                    
    rangeData.push(item.data);
                                });
                                
                                
    companyStoreFields.push({
                                    
    namecolumnName
                                
    });
                                
                                
    modelCounter += 1;
                                var 
    modelName 'Company' modelCounter;
                                
                                
    Ext.define(modelName, {
                                    
    extend'Ext.data.Model',
                                    
    fieldscompanyStoreFields
                                
    });
                                
                                var 
    companyStore Ext.create('Ext.data.Store', {
                                    
    modelmodelName,
                                    
    datarangeData,
                                    
    proxy: {
                                        
    type'memory',
                                        
    reader: {
                                            
    type'json',
                                            
    root'items'
                                        
    }
                                    }
                                });
                                
                                var 
    column Ext.create('Ext.grid.column.Column', {
                                    
    textcolumnName,
                                    
    dataIndexcolumnName,
                                    
    editor: {
                                        
    xtype'textfield'
                                    
    }
                                });
                                
                                if (!
    gridColumn) {
                                    
    grid.headerCt.add(column);
                                }
                                else {
                                    
    grid.headerCt.insert(gridColumncolumn);
                                }

                                
    grid.reconfigure(companyStore);
                            }
                        });
                    } 

Thread Participants: 1