#5457 closed defect (invalid)
dojox.layout.ScrollPane in TabContainer not scrolling
Reported by: | guest | Owned by: | dante |
---|---|---|---|
Priority: | high | Milestone: | 1.1 |
Component: | DojoX Layout | Version: | 1.0 |
Keywords: | dojox.ScrollContainer scrolling | Cc: | dante |
Blocked By: | Blocking: |
Description
Dojox.ScrollPane? does not work in TabContainer?
Dante can find an example on dc/~nonken/
Following markup does not scroll (with ContentPane? instead of LayoutContainer? as well):
<div dojoType="dijit.layout.LayoutContainer?" style="width:401px; height:400px; border:1px solid #b7b7b7;">
<div dojoType="dojox.layout.ScrollPane?" sizeShare="20" layoutAlign="left" style="width:100px; height:400px; border-right:1px solid #333">
<ol class="list">
<li id="cloneMe"><a href="#"><span>testItem</span></a></li>
<li id="cloneMe1"><a href="#"><span>testItem</span></a></li> <li id="cloneMe2"><a href="#"><span>testItem</span></a></li> <li id="cloneMe3"><a href="#"><span>testItem</span></a></li> <li id="cloneMe4"><a href="#"><span>testItem</span></a></li> <li id="cloneMe5"><a href="#"><span>testItem</span></a></li> <li id="cloneMe6"><a href="#"><span>testItem</span></a></li> <li id="cloneMe7"><a href="#"><span>testItem</span></a></li> <li id="cloneMe8"><a href="#"><span>testItem</span></a></li> <li id="cloneMe9"><a href="#"><span>testItem</span></a></li> <li id="cloneMe0"><a href="#"><span>testItem</span></a></li> <li id="cloneMe11"><a href="#"><span>testItem</span></a></li> <li id="cloneMe12"><a href="#"><span>testItem</span></a></li> <li id="cloneMe13"><a href="#"><span>testItem</span></a></li> <li id="cloneMe14"><a href="#"><span>testItem</span></a></li> <li id="cloneMe15"><a href="#"><span>testItem</span></a></li> <li id="cloneMe16"><a href="#"><span>testItem</span></a></li> <li id="cloneMe17"><a href="#"><span>testItem</span></a></li> <li id="cloneMe18"><a href="#"><span>testItem</span></a></li> <li id="cloneMe19"><a href="#"><span>testItem</span></a></li> <li id="cloneMe20"><a href="#"><span>testItem</span></a></li> <li id="cloneMe21"><a href="#"><span>testItem</span></a></li> <li id="cloneMe22"><a href="#"><span>testItem</span></a></li> <li id="cloneMe23"><a href="#"><span>testItem</span></a></li> <li id="cloneMe24"><a href="#"><span>testItem</span></a></li>
</ol>
</div> <div layoutAlign="right" dojoType="dijit.layout.ContentPane?" style="width:300px">
<p>Foo!</p>
</div>
</div>
Change History (3)
comment:1 Changed 13 years ago by
Component: | General → Dojox |
---|---|
Milestone: | 1.0.3 → 1.1 |
Owner: | changed from anonymous to dante |
Summary: | Dojox.ScrollPane in TabContainer not scrolling → dojox.layout.ScrollPane in TabContainer not scrolling |
comment:2 Changed 13 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
here is a workaround:
// connect to selectChild of the right tab container until the scrollPane // is shown for the first time, then call layout and disconnect the subscription spConnect = dojo.subscribe("index-tabs-right-selectChild",function(m){ if(m == dijit.byId("spotlightTab")){ dijit.byId("spotlightScroller").layout(); dojo.unsubscribe(spConnect); } });
comment:3 Changed 10 years ago by
Component: | Dojox → DojoX Layout |
---|
it's actually the same issue of all layout widgets: layout() isn't called initially when the pane is display:none (default style for hidden tabs, et al) ... the layout() that bubbles when something like window.resize causes the scrolling to trigger (resize the browser while the tab is visible and the calculations are accurate). a workaround would be to dojo.subscribe to the tab's "selected" topic, and call layout() at least once to make sure the sizes can be calculated.
one solution to suggest to dijit.layout would be an onFisrtShow-like event to connect to, so the user could call custom code (or simply assume the need to call layout() onFirstShow) and work around problem of sizing and display:none