PDA

View Full Version : Dynamically add items in a tbar



vino_pv
3 May 2014, 10:57 AM
Hi,

I want to add the text and menus dynamically in a tbar.
Is it possible?
Pls help me out.

Thanks in advance.

jsakalos
3 May 2014, 12:15 PM
Just call toolbar.add (http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.toolbar.Toolbar-method-add).

vino_pv
3 May 2014, 12:43 PM
I need to add the texts and menus from json.

jsakalos
3 May 2014, 3:25 PM
Post some code so that we can see how far have you got.

vino_pv
3 May 2014, 7:53 PM
I could't load the tbar content from json. So i have created a variable in my jsp page and i have dynamically added contents of it.
Below is my code . When i executed the below code, i am getting exception Toolbar is undefined. I tried new Ext.toolbar.Toolbar() same error.
I have loaded ExtJs files properly.

<script>var tb = new Ext.Toolbar();
tb.add(
<%List<String> menu = Utils.getMenus();
int size = menu!=null?menu.size():0;
for(int i=0;i<size;i++){
String menuName = (String)menu.get(i);%>
<%if(i>0){%>
<%=","%>
<%}%>
<%="{"%>
<%="xtype:'button',"%>
<%="text:'"+menuName+"',")%>
<%="menu:["%>
<%
List<String> parent = Utils.getParentMenus(menuName);
int parentSize = parent!=null?parent.size():0;
for(int j=0;j<parentSize;j++){
String parentName = (String)parent.get(j);%>
<%if(j>0){%>
<%=","%>
<%}%>
<%="{"%>
<%"text:'"+parentName+"',")%>
<%="menu:{"%>
<%="items:["%>
<%
List<String> child = Utils.getChildMenus(parentName);
int childSize = child!=null?child.size():0;
for(int k=0;k<childSize;k++){
String childName= (String)child.get(k);%>
<%if(k>0){%>
<%=","%>
<%}%>
<%="{"%>
<%="text:'"+childName%>
<%="}"%>
<%}%>

<%="]"%>
<%="}"%>
<%="}"%>
<%}%>
<%="]"%>
<%="}"%>
<%}%>
);
</script>

jsakalos
3 May 2014, 11:17 PM
It looks like a server code that generates javascript. Although it could work, I wonder why would you do it like that? If you need to get data from the server then return json, not complete javascript.

Here are my experiences and thoughts on the matter:

http://extjs.eu/experience-ext-component-loading-can-be-slow/
http://extjs.eu/changing-the-viewpoint-to-ext/

vino_pv
3 May 2014, 11:50 PM
Thank you very much. But.
I could't find any example to load the toolbar items from json.
Or is there any other way to create a menu for my webpage. But it should be a dynamic menu.
Pls help me out on this.
Thanks.

evant
3 May 2014, 11:51 PM
http://docs.sencha.com/extjs/4.2.2/extjs-build/examples/component-loader/component-loader.html

vino_pv
4 May 2014, 1:15 AM
Thanks for the reply.
It does't help me.
This is my viewport.

Ext.application({
name: 'MainViewPort',
views: ['MenuStore','MapPanel'],
appFolder: '/sms/apps/user',
launch: function() {

Ext.create('Ext.container.Viewport', {
padding:10,
layout: 'border',
items: [

{
id: 'mainContent',
collapsible: false,
region: 'center',
border: true,
frame:true,
layout : 'hbox',
layoutConfig : {
pack : 'center',
align : 'center'
},
tbar: // I have to tbar items from server.(Both texts and menu items also)
items:[{
xtype:'panel',
}]

}
]
});
}
});

Please advise me how to do this.
Thanks

evant
4 May 2014, 4:39 AM
Did you read the example code? It loads content into the panel from a JSON block that comes from the server. Sounds like that's exactly what you want.

vino_pv
4 May 2014, 8:51 AM
Ok. I will try this.
But i dont know how the JSON format has to be.