Please help!!!!!!! Grid + reconfigure + sortable

[dima]

I have problem where reconfigure grid object new ds and cm. First load grid sort worcking fine but i'm reconfigure grid sorting not worck FF error :
error: B has no properties
source: http://localhost/rel800/ext/ext-all.js
string: 43
this my code init grid

var ds; //hold our data
var grid; //component


var columnModel; // definition of the columns
var layout;

GridCustomer = function(){

    function setupDataSource(combo)
    {
        if(!ds)
        {
            ds = new Ext.data.Store({
            proxy: new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=gg'}),
            reader: new Ext.data.XmlReader({
                    record: 'Item',
                    id: 'ID'
                    }, ['GROUP','GROUPCODE','PERSGROUP','SZIN','PTM'])
            });
            ds.on('loadexception', function(){alert("load exception")});
            ds.load();
        }
        else
        {    
            ds.reader =  new Ext.data.XmlReader({record: 'Item',id: 'ID'},['GROUP','GROUPCODE','PERSGROUP','SZIN','PTM']);
            ds.proxy = new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=gg'});
            ds.reload();
        }
        
    }
    function getColumnModel()
    {
         columnModel = new Ext.grid.ColumnModel(
                [
                    {header: "Глобальная группа", dataIndex: 'GROUP' ,sortable: true, renderer: function(v,md,record) 
                        {
                            return "<span style='color:#333333;font-size:14px'>"+ record.data['GROUP'] +"</span>";
                        }
                     },
                    {header: "Группы кодов", dataIndex: 'GROUPCODE',sortable: true, css: 'white-space:normal;' , renderer: function(v,md,record)
                        {
                            return "<pre style='color:#333333;font-size:14px'>"+ record.data['GROUPCODE'] +"</pre>";
                        }
                     },
                    {header: "Персональная группа ", dataIndex: 'PERSGROUP',css: 'white-space:normal;' , renderer: function(v,md,record) {
                            return "<pre style='color:#333333;font-size:14px'>"+ record.data['PERSGROUP'] +"</pre>";}
                    },
                    {header: "Список запрещенных исх. номеров", dataIndex: 'SZIN',renderer: function(v,md,record) {
                            return "<pre style='color:#333333;font-size:14px'>"+ record.data['SZIN'] +"</pre>";}
                    },
                    {header: "Персональная таблица маршр.",  dataIndex: 'PTM',
                    renderer: function(v,md,record) {
                            return "<pre style='color:#333333;font-size:14px'>"+ record.data['PTM'] +"</pre>";}
                    }
                ]);
        
        return columnModel;
    }
    function buildGrid()
    {
        var rowSelectionModel = new Ext.grid.RowSelectionModel({singleSelect:true});
                                rowSelectionModel.on('beforerowselect',function(sm ,rowIndex,keepExisting){
                                return false;
                                });
        grid = new Ext.grid.Grid('example-grid',{ds: ds,
                                                loadMask: {msg: 'Загрузка...'},
                                                trackMouseOver :false,
                                            //    autoSizeColumns: true,
                                            //    autoSizeHeaders:true,
                                                monitorWindowResize: true,
                                                selModel: rowSelectionModel,
                                                autoScroll :false,
                                                autoSizeColumns: true,
                                                monitorWindowResize: true,
                                            //    autoHeight:true,    
                                            //    autoWidth:true,
                                                defaultSortable:true, 
                                                cm: getColumnModel()});
         var layout = Ext.BorderLayout.create({
            center: {
                margins:{left:3,top:3,right:3,bottom:3},
                panels: [new Ext.GridPanel(grid)]
            }
        }, 'grid-panel');
        grid.render();
        }
    return {
        init : function(combo) {setupDataSource(combo);    buildGrid();},
        getDataSource: function() {return ds;},
        updateColumnModel :function(){return getColumnModel();}, 
        updateDataSource: function(combo){setupDataSource(combo);}
    }
}();
InfoGroup = function(){
    
    function setupDataSource(combo)
    {    
        if(!ds)
        {
        if(combo == 0)
        {
            ds = new Ext.data.Store({proxy: new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=all'}),
                                     reader: new Ext.data.XmlReader({
                                             record: 'Item',
                                            id: 'ID'
                                           },['GROUP','CLIENT'])
                                    });
            ds.on('loadexception', function(){alert("load exception")});
            ds.load();
        }
        else{
            ds = new Ext.data.Store({proxy: new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=gr'}),
                                     reader: new Ext.data.XmlReader({
                                             record: 'Item',
                                            id: 'ID'
                                           },['GROUP','CLIENT'])
                                    });
            ds.on('loadexception', function(){alert("load exception")});
            ds.load();
            }
        }
        else{
            if(combo == 0)
            {
                ds.reader  = new Ext.data.XmlReader({record: 'Item',id: 'ID'},['GROUP','CLIENT']);
                ds.proxy = new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=all'});
                ds.reload();
            }
            else{
                ds.reader  = new Ext.data.XmlReader({record: 'Item',id: 'ID'},['GROUP','CLIENT']);
                ds.proxy = new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=gr'});
                ds.reload();
            }
        }
    }
    function getColumnModel(combo)
    {
        //if(!columnModel) {
        if(combo == 0)
        {
            columnModel = new Ext.grid.ColumnModel([
                    {header: "Маршрутизация Группы", dataIndex: 'GROUP'  ,sortable: true, renderer: function(v,md,record) 
                    {return "<pre style='color:#333333;font-size:14px'>"+ record.data['GROUP'] +"</pre>";}},
                    {header: "Коды состоящие в ней", dataIndex: 'CLIENT' ,sortable: true, css: 'white-space:normal;',renderer: function(v,md,record)
                    {return "<pre style='color:#333333;font-size:14px'>"+ record.data['CLIENT'] +"</pre>";}}]);
        }
        else
        {
            columnModel = new Ext.grid.ColumnModel([
                        {header: "Маршрутизация Группы", dataIndex: 'GROUP' ,sortable: true, renderer: function(v,md,record) 
                        {return "<pre style='color:#333333;font-size:14px'>"+ record.data['GROUP'] +"</pre>";}},
                        {header: "Клиенты", dataIndex: 'CLIENT',sortable: true,css: 'white-space:normal;',renderer: function(v,md,record)
                        {return "<pre style='color:#333333;font-size:14px'>"+ record.data['CLIENT'] +"</pre>";}}]);
        //}//end if colum init
        }
        return columnModel;
    }
    function buildGrid(combo)
    {
        var rowSelectionModel = new Ext.grid.RowSelectionModel({singleSelect:true});
                                rowSelectionModel.on('beforerowselect',function(sm ,rowIndex,keepExisting){
                                return false;
                                });
        grid = new Ext.grid.Grid('example-grid', {ds: ds,
                                                  autoHeight:true,
                                                  loadMask: {msg: 'Загрузка...'},
                                                  trackMouseOver :false,
                                                  autoSizeColumns: true,
                                                  monitorWindowResize: true,
                                                  selModel: rowSelectionModel,
                                                  defaultSortable:true, 
                                                  cm: getColumnModel(combo)});
         var layout = Ext.BorderLayout.create({
            center: {
                margins:{left:3,top:3,right:3,bottom:3},
                panels: [new Ext.GridPanel(grid)]
            }
        }, 'grid-panel');
        grid.render();                                                
    }
    return {
        init : function(combo) {setupDataSource(combo);    buildGrid(combo);},
            updateColumnModel :function(combo){return getColumnModel(combo);}, 
            getDataSource: function() {return ds;},
            updateDataSource: function(combo){setupDataSource(combo);}
    }
}();
InfoDirection = function()
{
    function setupDataSource(combo)
    {
         if(!ds)
         {
            if(combo == 0)
            {
                ds = new Ext.data.Store({proxy: new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=dir'}),
                                          reader: new Ext.data.XmlReader({
                                          record: 'Item',
                                          id: 'ID'
                                          }, ['CODE','DIRECTION'])});
                 ds.on('loadexception', function(){alert("load exception")});
                 ds.load();
            }
            else
            {
                 ds = new Ext.data.Store({proxy: new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=dir'}),
                                          reader: new Ext.data.XmlReader({
                                          record: 'Item',
                                          id: 'ID'
                                          }, ['CODE'])});
                 ds.on('loadexception', function(){alert("load exception")});
                 ds.load();
             }
         }
         else{
            if(combo == 0)
            {
                ds.reader  = new Ext.data.XmlReader({record: 'Item',id: 'ID'},['CODE','DIRECTION']);
                ds.proxy = new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=dir'});
                ds.reload();
            }
            else{
                ds.reader  = new Ext.data.XmlReader({record: 'Item',id: 'ID'},['CODE']);
                ds.proxy = new Ext.data.HttpProxy({url: 'genxml.php?id='+combo+'&t=dir'});
                ds.reload();
            }
        }
    }
    function getColumnModel(combo)
    {
        if(combo == 0)
        {
            columnModel = new Ext.grid.ColumnModel([
                             {header: "Коды", dataIndex: 'CODE',sortable: true,renderer: function(v,md,record){
                             return "<span style='color:#333333;font-size:14px'>"+ record.data['CODE'] +"</span>";}},
                             {header: "Направление",dataIndex: 'DIRECTION',sortable: true,renderer: function(v,md,record){
                             return "<span style='color:#333333;font-size:14px'>"+ record.data['DIRECTION'] +"</span>";}}]);
        }
        else
        {
            columnModel = new Ext.grid.ColumnModel([
                                 {header: "Коды", dataIndex: 'CODE',sortable: true,renderer: function(v,md,record){
                                 return "<span style='color:#333333;font-size:14px'>"+ record.data['CODE'] +"</span>";}}]);
        }
        return columnModel;
    }
    function buildGrid(combo)
    {
        var rowSelectionModel = new Ext.grid.RowSelectionModel({singleSelect:true});
                                rowSelectionModel.on('beforerowselect',function(sm ,rowIndex,keepExisting){
                                return false;
                                });
        grid = new Ext.grid.Grid('example-grid', {ds: ds,
                                                  loadMask:true,
                                                  trackMouseOver :false,
                                                  loadMask: {msg: 'Загрузка...'},
                                                  autoHeight:true,
                                                  autoSizeColumns: true,
                                                  selModel: rowSelectionModel,
                                                  defaultSortable:true, 
                                                  cm: getColumnModel(combo)});
         var layout = Ext.BorderLayout.create({
            center: {
                margins:{left:3,top:3,right:3,bottom:3},
                panels: [new Ext.GridPanel(grid)]
                
            }
            
        }, 'grid-panel');
        grid.render();
    }
    
    return {
        init : function(combo) {setupDataSource(combo);    buildGrid(combo);},
            updateColumnModel :function(combo){return getColumnModel(combo);}, 
            getDataSource: function() {return ds;},
            updateDataSource: function(combo){setupDataSource(combo);}
    }

}(); 

this is code reconfigure

function loading()
{
    dlg.hide();
    
    if(grid)
    {
            GridCustomer.updateDataSource(combo.getValue());
            grid.reconfigure(GridCustomer.getDataSource(),GridCustomer.updateColumnModel());
            grid.getView().autoSizeColumns(); 
            
    }
    else
    {
        GridCustomer.init(combo.getValue());
        grid.getView().autoSizeColumns(); 
    }
}

function loading_dir()
{
    
    dlg3.hide();
    
    if(grid)
    {
        InfoDirection.updateDataSource(combo3.getValue());
        grid.reconfigure(InfoDirection.getDataSource(),InfoDirection.updateColumnModel(combo3.getValue()));
        grid.getView().autoSizeColumns(); 
    }        
    else{InfoDirection.init(combo3.getValue());grid.getView().autoSizeColumns();
    }
}     
function loading_gr()
{
    dlg2.hide();
    if(grid)
    {
        
        InfoGroup.updateDataSource(combo2.getValue());
        grid.reconfigure(InfoGroup.getDataSource(),InfoGroup.updateColumnModel(combo2.getValue()));
        grid.getView().autoSizeColumns(); 
    }        
    else
    {
            InfoGroup.init(combo2.getValue());
            grid.getView().autoSizeColumns();
     }
} 

where my problens? any bug Ext

[tryanDLS]

Use ext-all-debug.js and Firebug to see where that error is occurring.

[dima]

Use ext-all-debug.js and Firebug to see where that error is occurring.

I include ext-all-debug.js
view error
error: f has no properties
source: http://localhost/rel800/ext/ext-all-debug.js
string: 10540

sort : function(fieldName, dir){
        var f = this.fields.get(fieldName);
        if(!dir){
            if(this.sortInfo && this.sortInfo.field == f.name){ 
                dir = (this.sortToggle[f.name] || "ASC").toggle("ASC", "DESC");
            }else{
                dir = f.sortDir;
            }
        }
        this.sortToggle[f.name] = dir;
        this.sortInfo = {field: f.name, direction: dir};
        if(!this.remoteSort){
            this.applySort();
            this.fireEvent("datachanged", this);
        }else{
            this.load(this.lastOptions);
        }
    }, 

I know object grid no update colum model...????????

[dima]

Use ext-all-debug.js and Firebug to see where that error is occurring.

[QUOTE=dima;90543]I include ext-all-debug.js
view error
error: f has no properties
source: http://localhost/rel800/ext/ext-all-debug.js
string: 10540

sort : function(fieldName, dir){
        var f = this.fields.get(fieldName);
        if(!dir){
            if(this.sortInfo && this.sortInfo.field == f.name){ 
                dir = (this.sortToggle[f.name] || "ASC").toggle("ASC", "DESC");
            }else{
                dir = f.sortDir;
            }
        }
        this.sortToggle[f.name] = dir;
        this.sortInfo = {field: f.name, direction: dir};
        if(!this.remoteSort){
            this.applySort();
            this.fireEvent("datachanged", this);
        }else{
            this.load(this.lastOptions);
        }
    }, 

When i
for(var k in this.fields)
{
alert(this.fields[k],this.fields)
}
I get last column index and function this.fields.get(fieldName) no get my new column name...
and function sort no set property colum sorting. Where error i dont know....

[dima]

[QUOTE=dima;90604]

I include ext-all-debug.js
view error
error: f has no properties
source: http://localhost/rel800/ext/ext-all-debug.js
string: 10540

sort : function(fieldName, dir){
        var f = this.fields.get(fieldName);
        if(!dir){
            if(this.sortInfo && this.sortInfo.field == f.name){ 
                dir = (this.sortToggle[f.name] || "ASC").toggle("ASC", "DESC");
            }else{
                dir = f.sortDir;
            }
        }
        this.sortToggle[f.name] = dir;
        this.sortInfo = {field: f.name, direction: dir};
        if(!this.remoteSort){
            this.applySort();
            this.fireEvent("datachanged", this);
        }else{
            this.load(this.lastOptions);
        }
    }, 

When i
for(var k in this.fields)
{
alert(this.fields[k],this.fields)
}
I get last column index and function this.fields.get(fieldName) no get my new column name...
and function sort no set property colum sorting. Where error i dont know....

I'm find one solution i change id colum all table identity.

[Gonzo]

Hi, I have the same problem, after calling reconfigure my grid doesn't even do requests when clicking on column headers.
I don't understand what solution did you find. Could you be more clear on that?
Thanks a lot,
Gonzalo