Opened 13 years ago
Closed 13 years ago
#4717 closed defect (invalid)
Wrong layout of tabs container in a dijit
Reported by: | Frederic.Stark at gmail.com | Owned by: | Adam Peller |
---|---|---|---|
Priority: | high | Milestone: | |
Component: | Dijit | Version: | 0.9 |
Keywords: | Cc: | ||
Blocked By: | Blocking: |
Description
HOW TO REPRODUCE:
Go to http://82.230.65.68:31416/~fred/dojo/fred_samples/bug_010.html (or use the attached file)
Click on button "Add Content Dijit"
A new tab appear (labelled "Top Tab4")
Click on it
RESULT:
A bright yellow div appear
EXPECTED RESULT:
Two horizontal tabs on a yellow background, and a green content zone reading "Content 1"
ADDITIONAL INFO:
1 Resize the window, the two tabs will appear.
2 Go back to "Top Tab1"
3 Re-click on "Add Content Dijit"
4 Go to the new tab
5 Resize the window, the horizontal tabs appear
6 Go back to the previous tab, the horizontal tabs that appeared on step 1 have disapeared.
7 Switching between the two tabs while resizing the window show that when the current tab have its layout redone, the previous one is lost.
COMMENTS:
Occurs on Firefox 2 Mac OS X
Occurs on Safari Mac OS X (with minor difference: the tab title are always visible)
Occurs on IE6 Windows
Using latest trunk
If tried to add startup() and layout() with no meaningful results.
Will be happy with a workaround that let me programmatically add tabs to an existing tab (it works if done in html with dojoType)
Attachments (1)
Change History (6)
Changed 13 years ago by
Attachment: | bug_010.html added |
---|
comment:1 Changed 13 years ago by
Summary: | Tab con → Wrong layout of tabs container in a dijit |
---|
comment:2 Changed 13 years ago by
Owner: | set to Adam Peller |
---|---|
Reporter: | changed from guest to [email protected]… |
comment:3 Changed 13 years ago by
Reporter: | changed from [email protected]… to Frederic.Stark at gmail.com |
---|
comment:4 Changed 13 years ago by
I am the original reporter.
Adding a
resize:function() {
this._tabContainer.resize();
}
to the custom widget fixed the issue. To be properly laid out, the tab needs to have its "layout" function called when the user click on the tab, normally (ie: if defined in HTML inline code) with the following stack frame:
TabContainer::layout _LayoutWidget::resize StackContainer::_transition StackContainer::selectChild StackController::onButtonClick
The custom dijit had no resize function, so the tab container was not re-laid out when the tab was clicked.
comment:5 Changed 13 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
Right, and this is just the way the system works. Every layout widget needs a startup() and resize() method. You might want to have your custom widget extend _LayoutWidget.
Html file to reproduce the issue