ExtJs：update（）＆autoScroll不起作用

Question

我正在嘗試更新tabPanel的html。滾動條在初始加載時存在，但在update上滾動條消失。

這是我的代碼：

var text = "a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>"; 

    years = []; 
    items = []; 
    for(i=this_year; i>2002; i--) { 
     years.push(i); 
    } 

    for(i=0; i<parents.length; i++) { 

     items.push({ 
      xtype: 'tabpanel', 
      title: years[i], 
      id: 'tabs' + years[i], 
      activeTab: 0, 
      autoScroll: true, 
      html: text, // this works just fine 
     }); 
    } 

    var tp = new Ext.TabPanel({ 
     renderTo: div, 
     id: 'tabs', 
     activeTab: 0, 
     items: items, 
     autoFit: true, 
     height: 500, 
     width: 500, 
     listeners: { 
      'tabchange': function(tabPanel, tab){ 
       // dynamically update the html 
      } 
     } 
    }); 

    // but if i instead use this the scrollbar disappears 
    Ext.get('tabs' + 2014).update(text); 

有一些其他的方式來更新HTML？

Answer 1

得到它與contentEl工作和jQuery的appendTo：

years = []; 
items = []; 
for(i=this_year; i>2002; i--) { 
    years.push(i); 
} 

for(i=0; i<parents.length; i++) { 

    $('<div id="tabs' + years[i] + '"></div>').appendTo("#some_div"); 

    items.push({ 
     xtype: 'tabpanel', 
     title: years[i], 
     id: 'foo-tabs' + years[i], 
     activeTab: 0, 
     autoScroll: true, 
     contentEl: 'tabs' + years[i], 
    }); 
} 

var tp = new Ext.TabPanel({ 
    renderTo: div, 
    id: 'foo-tabs', 
    activeTab: 0, 
    items: items, 
    autoFit: true, 
    height: 500, 
    width: 500, 
    listeners: { 
     'tabchange': function(tabPanel, tab){ 

     } 
    } 
}); 

$('some html').appendTo('#tabs' + year);