PDA

View Full Version : how to override Ext.layout.BorderLayout.Region.prototype



PercyJackson
19 Nov 2012, 1:20 AM
How to override Ext.layout.BorderLayout.Region .prototype?
I need to make changes to it but wondering how to override it.
Ext.override(Ext.layout.BorderLayout.Region,{
getCollapsedEl : function(){
if(!this.collapsedEl){
if(!this.toolTemplate){
var tt = new Ext.Template(
'<img src="" class="x-tool x-tool-{id}" style="background:none" />'
);
tt.disableFormats = true;
tt.compile();
Ext.layout.BorderLayout.Region.prototype.toolTemplate = tt;
}
this.collapsedEl = this.targetEl.createChild({
cls: "x-layout-collapsed x-layout-collapsed-"+this.position,
id: this.panel.id + '-xcollapsed'
});
this.collapsedEl.enableDisplayMode('block');


if(this.collapseMode == 'mini'){
this.collapsedEl.addClass('x-layout-cmini-'+this.position);
this.miniCollapsedEl = this.collapsedEl.createChild({
cls: "x-layout-mini x-layout-mini-"+this.position, html: "&#160;"
});
this.miniCollapsedEl.addClassOnOver('x-layout-mini-over');
this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
this.collapsedEl.on('click', this.onExpandClick, this, {stopEvent:true});
}else {
if(this.collapsible !== false && !this.hideCollapseTool) {
var t = this.toolTemplate.append(
this.collapsedEl.dom,
{id:'expand-'+this.position}, true);
t.addClassOnOver('x-tool-expand-'+this.position+'-over');
t.on('click', this.onExpandClick, this, {stopEvent:true});
}
if(this.floatable !== false || this.titleCollapse){
this.collapsedEl.addClassOnOver("x-layout-collapsed-over");
this.collapsedEl.on("click", this[this.floatable ? 'collapseClick' : 'onExpandClick'], this);
}
}
}
return this.collapsedEl;
}
});

but its not working.

PercyJackson
19 Nov 2012, 1:31 AM
Sorry guys,
I found the mistake.
prototype is like adding a feature to the Region.
so i had to override Region then add the function getCollapsedEl.
Now it is working.