PDA

View Full Version : calling reconfigure on Ext.grid.Grid, causes multiple stylesheets to be generated.


Alan Knowles
04-26-2007, 12:38 AM
When using external data sources, and refilling a grid with a new store/ column model, by calling Grid.reconfigure(ds, cm)

The grid calls Ext.grid.AbstractGridView.prototype.generateRules, which generates a new stylesheet block each time.

When combined with column hiding/showing, you end up with multiple rules for each column, and the columns can not be unhidden.

The fix for this is:


Ext.grid.AbstractGridView.prototype.currentStyleSh eet = false;
Ext.grid.AbstractGridView.prototype.generateRules = function(cm){

// dont keep making rules...?
// this may not work for new colusmn?
if (this.currentStyleSheet) {
return this.currentStyleSheet;


}
var ruleBuf = [];
for(var i = 0, len = cm.getColumnCount(); i < len; i++){
var cid = cm.getColumnId(i);

ruleBuf.push(this.colSelector, cid, " {\n", cm.config[i].css, "}\n",
this.tdSelector, cid, " {\n}\n",
this.hdSelector, cid, " {\n}\n",
this.splitSelector, cid, " {\n}\n");
}
this.currentStyleSheet = Ext.util.CSS.createStyleSheet(ruleBuf.join(""));
return this.currentStyleSheet;
}



The other workaround may be to not send reconfigure the column model... - but it's a bit of a gotcha.. - (eg. there is no indication that you should not send columnModels to reconfigure...)

jack.slocum
04-26-2007, 03:04 PM
If you need to reconfigure columns within the same container element, you will need assign ids to the columns to prevent overlap (I am assuming you are using the auto generated numeric ids?). You may also try overriding the column model constructor and applying different auto generated ids with a unique seed value.

I haven't been able to find a cross browser way to destroy the rules.

mystix
04-27-2007, 12:53 AM
I haven't been able to find a cross browser way to destroy the rules.

hi jack, if by "rules" you mean the entire <style> block, then programmatically assigning an id to Ext generated <style> tags i.e. <style id='mystyle'>
.
.
.
</style>in the createStyleSheet() method will allow access to it's DOM reference via Ext.get() in both IE and FF.

does this help? 'cos i noticed a removeStyleSheet() method in Ext.util.CSS, but there doesn't seem to be any id associated with Ext generated <style> tags.

mystix
05-01-2007, 06:38 AM
bump