Dojo tabContainer沒有正確顯示Dojo控件

我想用Dojo工具包編寫一個複雜的應用程序，主屏幕包含：左主菜單，它是Dojo手風琴，頂部條和主頁，它是tabContainer，打開了一個新標籤每一擊左側菜單中，Dojo tabContainer沒有正確顯示Dojo控件

我嘗試在新的標籤內容，以顯示包含其他道場控制這樣的網格（EnhancedGrid），道場窗體控件等

的問題是，外部頁面Dojo控件不會呈現標籤容器下的Dojo控件

此處與每一位左擊打開一個新的標籤（頁）主要功能：

dojo.addOnLoad(function() { 
    var opened = {}; 
    dojo.forEach(dojo.query("#leftAccordion a"), function(aTag) { 
     dojo.connect(aTag, 'onclick', null, function(e) { 
      dojo.stopEvent(e); 
      var tabs = dijit.byId("topTabs"); 
      var pane = opened[aTag.href]; 
      if (!pane) 
      { 
       pane = new dijit.layout.ContentPane({ 
        title: aTag.title, 
        closable: true, 
        href: aTag.href, 
        onClose: function() { 
         opened[aTag.href] = null; 
         return true; 
        } 
       }); 
       opened[aTag.href] = pane; 
       tabs.addChild(pane); 
      } 
      tabs.selectChild(pane); 
     }); 
    }); 
});

這裏的HTML（包含道場功能）：

<div id="main" data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="liveSplitters:false, design:'sidebar'"> 
     <div id="header" data-dojo-type="dijit.MenuBar" data-dojo-props="region:'top'"> 
      <div data-dojo-type="dijit.MenuBarItem" data-dojo-props="iconClass:'dijitIconDelete'" data-dojo-props="onclick: function(){ alert('no submenu, just a clickable MenuItem'); }"> 
       שולחן עבודה 
      </div> 
      <div data-dojo-type="dijit.MenuBarItem" data-dojo-props="onclick: function(){ alert('no submenu, just a clickable MenuItem'); }"> 
       משימות 
      </div> 

         <div data-dojo-type="dijit.MenuBarItem" data-dojo-props="onclick: function(){ alert('no submenu, just a clickable MenuItem'); }"> 
       התנתק 
      </div> 
     </div> 

     <div data-dojo-type="dijit.layout.AccordionContainer" data-dojo-props="region:'leading', splitter:true, minSize:20, minSize: 100, maxSize:300" style="width: 200px;" id="leftAccordion"> 
      <?php 
      $opened = FALSE; 
      foreach($menues as $menu) 
      { 
       if ($opened == TRUE && $menu->parent == 0) 
       { 
        print '</ul>' . "\n"; 
        print '</div>' . "\n"; 
        $opened = FALSE; 
       } 

       if ($opened == FALSE && $menu->parent == 0) 
       { 
        print "<div data-dojo-type=\"dijit.layout.ContentPane\" data-dojo-props=\"title:'$menu->title'\">" . "\n"; 
        print ' <ul>' . "\n"; 
        $opened = TRUE; 
       } 
       else{ 
        $url = $this->config->slash_item('index_url') . $menu->url; 
        print "  <li><a href=\"$url\" title=\"$menu->title\">$menu->title</a></li>" . "\n"; 
       } 
      } 
      if ($opened == TRUE) 
      { 
       print ' </ul>' . "\n"; 
       print '</div>' . "\n"; 
      } 
      ?> 

     </div><!-- end AccordionContainer --> 

     <!-- top tabs (marked as "center" to take up the main part of the BorderContainer) --> 
     <div data-dojo-type="dijit.layout.TabContainer" data-dojo-props="region:'center', tabStrip:true" id="topTabs"> 

      <div id="basicFormTab" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="title:'Basic Form Widgets', style:'padding:10px;display:none;'"> 

      </div> 
     </div><!-- end of region="center" TabContainer --> 
    </div>

來源

2012-01-04 Shlomi Elbaz

考慮到我自己對dojo的簡短和可怕的經驗，我會認爲錯誤是用css做的。我建議你找到一個頁面，實現類似於你正在嘗試的東西，並查看在那裏使用的CSS – Sheena 2012-06-29 14:33:46

你沒有爲我在你的問題提供足夠的信息輕鬆地運行測試或確定以下答案，但根據您的寫作，我相當確信您的問題是Dojo解析器不在您動態生成的窗格內容上運行。雖然我無法從您提供的代碼中判斷出來，但是在第一次加載頁面的時候，這是Dojo解析器運行一次的非常常見的配置，如果您沒有做任何改變這種行爲的方法，那可能是您的問題。

基本上，內容窗格中數據的加載完成後，你會想要做的事，如：

parser.parse(dom.byId("main"));

（假設該內容窗格中數據的根的id爲main ，因爲它是在上面的例子中，並且你已經需要parser和dom）

請大家看看Dojo Parser documentation（您可能需要向下滾動到解析器API筆記看看感興趣的區域）看到如何做這個操作的例子離子。您可以在Dojo ContentPane documentation中查看更多信息，以瞭解如何在內容窗格完成下載時鎖定回調。

希望這會有所幫助。

來源

2016-07-12 14:56:01 Feneric

Dojo tabContainer沒有正確顯示Dojo控件

回答

相關問題