PDA

View Full Version : Portas are giving error



AtulDawkhare
5 Apr 2012, 3:46 AM
Hi

I am using portal code, from the url.

http://docs.sencha.com/ext-js/4-0/#!/example/portal/portal.html
(http://docs.sencha.com/ext-js/4-0/#!/example/portal/portal.html)
If I used the same code, then it replace all the content with the portals, i.e. even If i write anything after html <Body> tag , it replace that / mask that and show only Portals.

My code is



Ext.define('Ext.app.Portal', {


extend: 'Ext.container.Viewport',


uses: ['Ext.app.PortalPanel','Ext.app.PortalColumn','Ext.app.gridportlet2', 'Ext.app.GridPortlet', 'Ext.app.ChartPortlet'],


getTools: function(){
return [{
xtype: 'tool',
type: 'gear',
handler: function(e, target, panelHeader, tool){
var portlet = panelHeader.ownerCt;
portlet.setLoading('Working8888888...');
Ext.defer(function() {
portlet.setLoading(false);
}, 2000);
}
}];
},


initComponent: function(){
var content = '<div class="portlet-content">'+Ext.example.shortBogusMarkup+'</div>';


Ext.apply(this, {
id: 'app-viewport',
layout: {
type: 'border',
padding: '0 5 5 5' // pad the layout from the window edges
},
items: [{
xtype: 'container',
region: 'center',
layout: 'border',
items: [{
id: 'app-portalsdsd',
xtype: 'portalpanel',
region: 'center',
items: [{
id: 'col-1',
items: [{
id: 'portlet-1',
title: 'Grid Portletaa',
tools: this.getTools(),
items: Ext.create('Ext.app.GridPortlet'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
},
{
id: 'portlet-22',
title: 'Grid Portlet2',
tools: this.getTools(),
items: Ext.create('Ext.app.GridPortlet2'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}

,{
id: 'portlet-2',
title: 'Portlet 2',
tools: this.getTools(),
html: content,
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}]
},{
id: 'col-2',
items: [{
id: 'portlet-3',
title: 'Portlet 3',
tools: this.getTools(),
html: '<div class="portlet-content">'+Ext.example.bogusMarkup+'</div>',
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}]
},{
id: 'col-3',
items: [{
id: 'portlet-4',
title: 'Stock Portlet',
tools: this.getTools(),
items: Ext.create('Ext.app.ChartPortlet'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}
,
{
id: 'portlet-5',
title: 'Stock Portlet3',
tools: this.getTools(),
items: Ext.create('Ext.app.ChartPortlet34'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}]
}]
}],renderTo:'PortalDiv'
}]
});
this.callParent(arguments);
},


onPortletClose: function(portlet) {
this.showMsg('"' + portlet.title + '" was removed');
},


showMsg: function(msg) {
var el = Ext.get('app-msg'),
msgId = Ext.id();


this.msgId = msgId;
el.update(msg).show();


Ext.defer(this.clearMsg, 3000, this, [msgId]);
},


clearMsg: function(msgId) {
if (msgId === this.msgId) {
Ext.get('app-msg').hide();
}
}
});


My requirement is, I want to show the portal at the specific location something like "renderTo"
So I have made changes in the code[shown in Red above]. But after this it gave me below error.



Uncaught TypeError: Object #<SVGAnimatedString> has no method 'replace'


Can you please suggest me what is wrong here? Did I made anything wrong? any how I want to assign to "PortalDiv" div
my html code is


<body>
My Dummy text

<div id="PortalDiv"></div>



</body>

scottmartin
5 Apr 2012, 6:28 AM
What version of ExtJS4 are you using? There have been several updates to the portal in 4.1. See if this corrects your problem. If not, please report back.

Regards,
Scott.

AtulDawkhare
5 Apr 2012, 6:47 AM
I am using 4.0.7 .
Is there any way to assign [i.e. somehting like "renderTo"] the Whole portal to any div ?

scottmartin
5 Apr 2012, 9:30 AM
I will ask, but I do not believe that is possible.

Scott.

AtulDawkhare
5 Apr 2012, 10:03 PM
ok Thanks Scott,

My requirement is whatever I type in the Body should not get mask / hide by the portal code.
Currently I am facing this problem. IS if renderTo is not supported then is there any other way to display the portal as well as my code.

I am expecting Something like showed in the attached image
33668

Currently this is happening.
33669
i.e. my header gets lost. So is there any way to achieve this ?

Please suggest