[SOLVED] Column question (Sama)

[MCSchlemme]

Sama,

I thought I'd direct this question to you or Brian since you are both familiar with our apps.

As you know, we have multiple tabs per app. Each tab contains the same columns. When we want to add, change or delete the tab's column content (or add a new tab), we must go into each app's columns and make the change.

I was thinking about how I could "COPY" in the columns' config, options, etc (see example below)

}, {
header : "<b>Actual sales<br/>This year<br/>April</b>",
sortable : true,
width : 100,
align : 'right',
dataIndex : 'Q0016',
type : 'dollar',
renderer : this.renderDollarNumerics
}, {

header : "<b>Actual sales<br/>This year<br/>May</b>",
sortable : true,
width : 100,
align : 'right',
type : 'dollar',
dataIndex : 'Q0017',
renderer : this.renderDollarNumerics
} {

Can I put these into a .js or something so when I needed to change the width of a column or hidden config, etc globally I could just change it in one place and effect all apps using that column?

I'm going to try and sound intelligent here (nobody laugh, please!). Could I create each column as an object? That way I could give each one default values (which would be used 90% of the time) and override some config option as needed? If this is possible, please give detailed instructions.

Thanks...

[nsama]

Mike,

You can create a .js for each column. Since you are programming in MVC you could do this:

Ext.define('xxx.xxx.xxx', {
    extend: 'Ext.grid.column.Column',
    alias: 'widget.actualsales', // with this you are defining an xtype 
    width : 100,
    type : 'dollar',
    sortable: true,
    align : 'right',
    initComponent: function(){
      // you can override the properties defined here
       this.header: this.myheader,
       this.dataIndex = this.myindex
       this.renderer = this.myrenderer
        this.callParent(arguments);
    }
    
});

'xxx.xxx.xxx' is the path to your .js
And then in your grid you can define column like this:

}, {
   xtype:'actualsales',
   myheader : '<b>Actual sales<br/>This year<br/>April</b>',
   myindex : 'Q0016',
   myrenderer : this.renderDollarNumerics
} {

Hope this helps.

[MCSchlemme]

Just what I was looking for.

Thanks!