Ext 2.0 のTabPanel
API Documentのサンプルと一緒。
<script type="text/javascript"> Ext.onReady(function() { var tab_panel = new Ext.TabPanel({ renderTo: 'tab-area', activeTab: 0, deferredRender: false, items:[ { contentEl: 'tab0-div', title: 'Tab 0' }, { contentEl: 'tab1-div', title: 'Tab 1' } ]}); }); </script> <div id="tab-area"></div> <div id="tab0-div" style="background-color: #DDDDFF">Tab0 Div</div> <div id="tab1-div" style="background-color: #FFDDDD">Tab1 Div</div>
- renderTo
- 無いと表示されない
- activateTab
- 無いと「どのタブも選択されていない」状態になり、タブしか表示されなくなる。
- deferredRender
- 無いとTab0、Tab1が両方表示された状態になる。
というわけで、最低この3つは指定しないと表示が(私の)意図通りにならない。