PDA

View Full Version : How to load a html archivo.js to contain a dynamic TabPanel?



BillySao
5 Sep 2013, 12:04 PM
Good afternoon,

I'm learning Sencha Archictect 2, my problem is this:
I have a load I Ext.tree.Panel records through a file. Json like this:



[{
"id": "0",
"text": "Parent",
"cls": "folder",
"expanded": true,
"leaf": false,

"children": [{
{
"id": "2",
"text": "children",
"cls": "folder",
"leaf": false,
"children": [{
"id": "3",
"text": "children1",
"href": "app/view/archive.js",
"leaf": true

}]
}]
}]


I would like to know how I can load, display and component I contains within tab.panel with the "loader" I see Sencha Architect saves the component with the. js and not as html.
the route:

App
|
|
-----model
-----store
-----view
|
|
--------archive.js

As is to be loaded with the "TabPanel"


loader (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.AbstractComponent-cfg-loader) : Ext.ComponentLoader (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.ComponentLoader)/Object (http://docs.sencha.com/extjs/4.2.1/#!/api/Object)1
A configuration object or an instance of a Ext.ComponentLoader (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.ComponentLoader) to load remote content for this Component.

Ext.create (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext-method-create)('Ext.Component (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.Component)',{ loader:{ url:'content.html', autoLoad:true}, renderTo:Ext.getBody (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext-method-getBody)()});



code:


var tapPanel = Ext.getCmp('tabPanel');
var childTab = tapPanel.getComponent(record.getId());
if(!childTab){
childTab = tapPanel.add(
{
id: record.getId(),
title: record.data.text,
closable:true,
layout: 'fit',
loader:{
url: record.data.href,
renderer: 'html',
scripts: true,
loadMask:{
showMask:true,
msg: 'loader' + record.data.href + '...'
}
},
autoScroll:true


});
}

tapPanel.setActiveTab(childTab);

jminnick
9 Sep 2013, 10:35 AM
I'm not totally following you here but is Archive.js your own file that you want to include into your project?

BillySao
9 Sep 2013, 12:47 PM
I'm not totally following you here but is Archive.js your own file that you want to include into your project?
Hello, I'm just studying extjs sencha architect and this year, so please have a little patience with me, I'll explain better:
I want to add a tab in the center as shown in the graph:
45735
but to give the event click not load the component, I read some forums on this and found that I need to reference the components, but I do not understand, I leave xda file:
Thank you.
Yes, the "archive.js" is within the project.

jminnick
9 Sep 2013, 5:29 PM
Hello, I'm just studying extjs sencha architect and this year, so please have a little patience with me, I'll explain better:
I want to add a tab in the center as shown in the graph:
45735
but to give the event click not load the component, I read some forums on this and found that I need to reference the components, but I do not understand, I leave xda file:
Thank you.
Yes, the "archive.js" is within the project.

if you want the href to be point to a particular place then you have to also use the hrefTarget property:

http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.data.NodeInterface-cfg-hrefTarget

BillySao
9 Sep 2013, 8:45 PM
if you want the href to be point to a particular place then you have to also use the hrefTarget property:

http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.data.NodeInterface-cfg-hrefTarget

Thank you for your prompt reply and give me a little time but this is not what I want, what I really seek is to add a component to the tab, ie I want to be able to click on the link or item of treePanel and open a new tab and I load a component specific and I contega within the tab.
Sorry for my ugly English.

45738