How to create dynamic tabs from a grid column on page load in extjs?

Thanks! I am following the same approach but when I am looping through the tabs its not able to add tabs dynamically . I am sure my loop is working properly because I put an alert and its looping through all the records.My code is below...Please let me know where I am wrong.

Thanks! I am following the same approach but when I am looping through the tabs its not able to add tabs dynamically . I am sure my loop is working properly because I put an alert and its looping through all the records.My code is below...Please let me know where I am wrong.. var store = new Ext.data.

JsonStore({ autoLoad: true, url: '../json/test. Json', root: 'results', fields: 'TIEBACK', 'GATE_TIME', 'TOTAL', 'STOP_DESC', 'DOOR' , sortInfo: { field: 'TIEBACK', direction: 'ASC' } }); my tabpanel: tabPanel = new Ext. TabPanel({ region: 'center', deferredRender: false, activeTab: 0, items: { xtype: 'grid', store: store, //selModel: selModel, columns: assignment, stripeRows: true, loadMask: true, height: 200, width: 200, x: 490, y: 620, title:'Assignment Status', bbar: pagingBar } }); loop: store.

On('load', function(){ store. Each(function(re) { var tieback = re. Get('TIEBACK'); //alert(tieback); tabPanel.

Add(tieback); }); }).

So you have the JSON store, something like this var store = new Ext.data. JsonStore({ // store configs autoDestroy: true, url: 'get-images. Php', storeId: 'myStore', // reader configs root: 'images', idProperty: 'name', fields: 'name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date'} }); Then you can add a callback function to the store that gets fired once it loads.

This is the documentation on that function load : ( Store this, Ext.data. Record records, Object options ) so, store. AddListener(load, function(store, records, options){ // loop over records and dynamically create tabs here }); So if you had a tabpanel like this var tabs = new Ext.

TabPanel({ renderTo:'tabs', resizeTabs:true, // turn on tab resizing minTabWidth: 115, tabWidth:135, enableTabScroll:true, width:600, height:250, defaults: {autoScroll:true}, plugins: new Ext.ux.TabCloseMenu() }); You can dynamically add tabs to it like this tabs. Add({ title: 'New Tab ' + (++index), iconCls: 'tabs', html: 'Tab Body ' + (index) + '' + Ext.example. BogusMarkup, closable:true }).show(); That should be everything you need, more documentation can be found here.

http://www.sencha.com/deploy/dev/examples/tabs/tabs-adv.html.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions