2009-07-23 2 views
4

Я пытаюсь получить dijits для рендеринга с использованием метода dojo.NodeList.instantiate, который принимает существующие элементы HTML и превращает их в dijits при загрузке DOM.Невозможно создать dijits через dojo.NodeList.instantiate

Ссылка на API для метода instantiate находится в here.

Следующий пример, который вызывает метод instantiate в методе dojo.addOnLoad, следует создать BorderContainer с двумя ContentPane экземпляров, но DIVs остаются, как они начинают, и не становится dijits:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Dijit Test</title> 
    <style type="text/css"> 
     @import "dojoroot/dijit/themes/tundra/tundra.css"; 
     @import "dojoroot/dojo/resources/dojo.css"; 
    </style> 
    <script type="text/javascript" src="dojoroot/dojo/dojo.js" 
     djConfig="parseOnLoad: true"></script> 
    <script type="text/javascript"> 
     dojo.require("dijit.layout.BorderContainer"); 
     dojo.require("dijit.layout.ContentPane"); 

     dojo.addOnLoad(
      function() { 
       dojo.query("#divOuter").instantiate(
        dijit.layout.BorderContainer, { 
         design : 'sidebar', 
         gutters : false 
        } 
       ); 

       dojo.query("#divMiddle").instantiate(
        dijit.layout.ContentPane, { 
         region : 'center' 
        } 
       ); 

       dojo.query("#divRight").instantiate(
        dijit.layout.ContentPane, { 
         region  : 'right', 
         splitter : true 
        } 
       ); 
      } 
     ); 
    </script> 
</head> 
<body> 
    <div id="divOuter" style="width:400px;height:300px"> 
     <div id="divMiddle">Middle box</div> 
     <div id="divRight">Right box</div> 
    </div> 
</body> 
</html> 

I попробовали вышеуказанный код как в Firefox 3.5, так и в Internet Explorer 7, и оба не смогли отобразить диджиты. Если я указываю стандартный атрибут HTML в объекте (например, атрибут style), это изменение стиля отображается правильно, указывая, что объект читается:

// The red border appears when using this example 
dojo.query("#divRight").instantiate(
    dijit.layout.ContentPane, { 
     region  : 'right', 
     splitter : true, 
     style  : 'border:1px solid red' 
    } 
); 

В следующий HTML (используя dojoType и другие атрибуты собственности) работает прекрасно - BorderContainer и ContentPanes правильно отображаются в обоих браузерах:

<div dojoType="dijit.layout.BorderContainer" design="sidebar" gutters="false" 
     style="width:400px;height:300px"> 
    <div dojoType="dijit.layout.ContentPane" region="center">Middle box</div> 
    <div dojoType="dijit.layout.ContentPane" region="right" splitter="true" 
     style="width:200px;">Right box</div> 
</div> 

Пожалуйста, может кто-нибудь сказать мне, почему instantiate пример не работает?

Я проделал много поиска, но не могу найти кого-либо еще с этой проблемой, что может означать, что я не использую метод instantiate правильно!

Спасибо.

ответ

2

Вам необходимо вызвать запуск на этих диджитах после их создания. dojo.query.instantiate не делает этого для вас, так как он просто создает объекты.

В нижней части вашей функции OnLoad добавьте эти:

dijit.byId('divOuter').startup(); 
dijit.byId('divMiddle').startup(); 
dijit.byId('divRight').startup(); 
+0

Спасибо очень много Сета - все работает сейчас – user143565

+0

Добро пожаловать. – seth

Смежные вопросы