dijit.layout.bordercontainer隐藏所有内容

我很难理解新版本1.7.1 dojo工具包并返回到1.5版本。我正在尝试包含bordercontainer来布局我的控件以匹配其中一个演示，但bordercontainer不断弄乱事情。dijit.layout.bordercontainer隐藏所有内容

http://download.dojotoolkit.org/release-1.6.1/dojo-release-1.6.1/dijit/themes/themeTester.html

我试图重新下面，我得到了菜单部分创建并做accordianContainer但如果我包括使用BorderContainer然后在出现的所有是一条线，看起来像集装箱消费寄托都和我做没有看到内部组件，包括菜单。任何想法赞赏。

<body class="claro"> 
    <form id="form1" runat="server"> 
    <asp:ScriptManager ID="ToolkitScriptManager1" runat="server"> 
    </asp:ScriptManager> 
      <div dojoType="dijit.Menu" id="submenu1" data-dojo-props='contextMenuForWindow:true, style:"display:none"' style="display: none;"> 
        <div dojoType="dijit.MenuItem">Enabled Item</div> 
        <div dojoType="dijit.MenuItem" data-dojo-props="disabled:true">Disabled Item</div> 
        <div dojoType="dijit.MenuSeparator"></div> 
        <div dojoType="dijit.MenuItem" data-dojo-props="iconClass:'dijitIconCut'">Cut</div> 
        <div dojoType="dijit.MenuItem" data-dojo-props="iconClass:'dijitIconCopy'">Copy</div> 
        <div dojoType="dijit.MenuItem" data-dojo-props="iconClass:'dijitIconPaste'">Paste</div> 
        <div dojoType="dijit.MenuSeparator"></div> 
        <div dojoType="dijit.PopupMenuItem"> 
           <span>Enabled Submenu</span> 
        <div dojoType="dijit.Menu" id="submenu2"> 
        <div dojoType="dijit.MenuItem">Submenu Item One</div> 
        <div dojoType="dijit.MenuItem">Submenu Item Two</div> 
        <div dojoType="dijit.PopupMenuItem"> 
           <span>Deeper Submenu</span> 
        <div dojoType="dijit.Menu" id="submenu4"> 
        <div dojoType="dijit.MenuItem">Sub-sub-menu Item One</div> 
        <div dojoType="dijit.MenuItem">Sub-sub-menu Item Two</div> 
        </div> 
       </div> 
       </div> 
       </div> 
       <div dojoType="dijit.PopupMenuItem" data-dojo-props="disabled:true"> 
         <span>Disabled Submenu</span> 
       <div dojoType="dijit.Menu" id="submenu3" style="display: none;"> 
       <div dojoType="dijit.MenuItem">Submenu Item One</div> 
       <div dojoType="dijit.MenuItem">Submenu Item Two</div> 
       </div> 
       </div> 
       <div dojoType="dijit.PopupMenuItem"> 
         <span>Different popup</span> 
       <div dojoType="dijit.ColorPalette"></div> 
       </div> 
       <div dojoType="dijit.PopupMenuItem"> 
         <span>Different popup</span> 
       <div dojoType="dijit.Calendar"></div> 
       </div> 
       </div> 



     <div id="main" dojoType="dijit.layout.BorderContainer" design="sidebar"> 
      <div id="header" dojoType="dijit.MenuBar" region="top"> 
             <div dojoType="dijit.PopupMenuBarItem" id="edit"> 
                 <span>Edit</span> 
              <div dojoType="dijit.Menu" id="editMenu"> 
               <div dojoType="dijit.Menu" id="Div1"> 
                 <div dojoType="dijit.MenuItem" id="cut" iconClass="dijitIconCut" 
                    onClick="console.log('not actually cutting anything, just a test!')">Cut</div> 
                 <div dojoType="dijit.MenuItem" id="copy" iconClass="dijitIconCopy" 
                    onClick="console.log('not actually copying anything, just a test!')">Copy</div> 
                 <div dojoType="dijit.MenuItem" id="paste" iconClass="dijitIconPaste" 
                    onClick="console.log('not actually pasting anything, just a test!')">Paste</div> 
                 <div dojoType="dijit.MenuSeparator" id="separator"></div> 
                 <div dojoType="dijit.MenuItem" id="undo" iconClass="dijitIconUndo">Undo</div> 
               </div> 
              </div> 
             </div> 
             <div dojoType="dijit.PopupMenuBarItem" id="view"> 
               <span>View</span> 
              <div dojoType="dijit.Menu" id="viewMenu"> 
              <div dojoType="dijit.MenuItem">Normal</div> 
              <div dojoType="dijit.MenuItem">Outline</div> 
              </div> 
              <div dojoType="dijit.PopupMenuItem"> 
               <span>Zoom</span> 
              <div dojoType="dijit.Menu" id="zoomMenu"> 
              <div dojoType="dijit.MenuItem">50%</div> 
              <div dojoType="dijit.MenuItem">75%</div> 
              <div dojoType="dijit.MenuItem">100%</div> 
              <div dojoType="dijit.MenuItem">150%</div> 
              <div dojoType="dijit.MenuItem">200%</div> 
              </div> 
              </div> 
             </div> 
             <div dojoType="dijit.PopupMenuBarItem" id="themes"> 
               <span>Themes</span> 
              <div dojoType="dijit.Menu" id="themeMenu"></div> 
             </div> 
             <div dojoType="dijit.PopupMenuBarItem" id="dialogs"> 
               <span>Dialogs</span> 
              <div dojoType="dijit.Menu" id="dialogMenu"> 
              <div dojoType="dijit.MenuItem" data-dojo-props="onClick: showDialog">slow loading</div> 
              <div dojoType="dijit.MenuItem" data-dojo-props="onClick: showDialogAb">action bar</div> 
              </div> 
             </div> 
             <div dojoType="dijit.PopupMenuBarItem" id="inputPadding"> 
               <span>TextBox Padding</span> 
              <div dojoType="dijit.Menu" id="inputPaddingMenu"> 
              <div dojoType="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding, checked:true">theme default</div> 
              <div dojoType="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">0px</div> 
              <div dojoType="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">1px</div> 
              <div dojoType="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">2px</div> 
              <div dojoType="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">3px</div> 
              <div dojoType="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">4px</div> 
              <div dojoType="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">5px</div> 
              </div> 
             </div> 
             <div dojoType="dijit.PopupMenuBarItem" id="help"> 
               <span>Help</span> 
              <div dojoType="dijit.Menu" id="helpMenu"> 
              <div dojoType="dijit.MenuItem">Help Topics</div> 
              <div dojoType="dijit.MenuItem">About Dijit</div> 
              </div> 
             </div> 
             <div dojoType="dijit.PopupMenuBarItem" data-dojo-props="disabled:true"> 
               <span>Disabled</span> 
              <div dojoType="dijit.Menu"> 
              <div dojoType="dijit.MenuItem">You should not see this</div> 
              </div> 
             </div> 
       </div> 
       <div dojoType="dijit.layout.AccordionContainer"minSize="20" style="width: 300px;" id="leftAccordion" region="left" splitter="true"> 

         <div dojoType="dijit.layout.ContentPane" title="Popups and Alerts"><div style="padding:8px"> 
         </div> 
       </div><!-- end AccordionContainer -->           
      </div> 
     </div> 
    </form>

来源

2012-05-02 vbNewbie

它可以棘手的使用BorderContainer呈现。通常我发现这是一个大小问题，而且它完全是错误的大小。

我通常会尝试：

使用浏览器的开发工具，以检查对应使用BorderContainer，并找出它的实际大小是什么。它通常就像名为“度量标准”的选项卡，它指示容器的确切位置和大小，以及它的填充和边距是怎么回事。有可能是0px高。
在您的HTML中，明确地将BorderContainer div的宽度和高度设置为static和hardcoded（例如style =“width：300px; height：300px”）并查看会发生什么。

来源

2012-05-02 19:57:34

感谢您的帮助。你在dojo的东西/生产团队的一部分工作很多吗？有没有其他的信息来源可以帮助解决道场问题？不想继续讨厌你？ – vbNewbie

在过去的几个月里，我刚刚和Dojo玩过很多次。官方文档（三套：教程，参考指南和API文档[按照有用性递减的顺序！]）和来源是真正的最大信息来源。 –

我想，除了罗伊斯顿的解决方案，什么工作对我来说只是这样做：
dijit.byId（“主”）调整（）。
（其中“main”是BorderContainer的ID）。

来源

2014-01-14 19:43:07 Tarek

dijit.layout.bordercontainer隐藏所有内容

回答

相关问题