extjs - Create tabs inside tab panel dynamically based on a given value -

hi have started learning sencha .

i need create tab panel in view , dynamically add tab panels ...

number of tab panels can changed

if number set 2, need create 2 tab panels , if set 4 need create 4 tab panels

can guide me please ?

here's example fiddle adds new tabs tab panel dynamically.

code:

ext.define('myapp.view.tab', {     extend: 'ext.panel.panel',     alias: 'widget.mytab',     html: 'tab content' });   ext.application({     name : 'myapp',      launch : function() {         ext.create('ext.tab.panel', {             reference: 'tabpanel',             renderto: ext.getbody(),             items: {                 xtype: 'mytab'                 ,title: 'first tab'             },             tbar: [{                 xtype: 'numberfield',                 value: 3             },{                 text: 'add tabs'                 ,handler: function(btn) {                     var tabpanel = btn.up('tabpanel'),                         numtabs = tabpanel.down('numberfield').getvalue(),                         i;                     (i = 1; <= numtabs; i++) {                         tabpanel.add({                             xtype: 'mytab',                             title: 'tab #'+i,                             html: 'content tab '+i                         });                     }                                     }             }]         });             } });