2011-01-03 1 views
0

У меня возникли проблемы с dijit.form.Select items.Инструментарий Dojo js: проблема с динамически заполненным выбором

На странице у меня есть два из этих элементов: один заполняется, когда страница html загружается, а другая заполняется в зависимости от того, какой вариант пользователь выбрал на первом.

Вот пример того, что я говорю о (теперь я держу код простой, но в реальной версии я включил все необходимые додзё модули и библиотеки, в головной части):

<html> 
     <head> 
       <script type="text/javascript"> 
         function updateB(val){ 

           var menu = dojo.byId("selB"); 

           menu.options.lenght=0; 

           if(val=="aaa") 
             menu.addOption({value: "aa", label: "aa"}); 
           else 
             menu.addOption({value: "bb", label: "bb"}); 
         } 
       </script> 
     </head> 

     <body> 
       <select id="selA" name="selA" dojoType="dijit.form.Select" style="width: 180px;" onchange="updateB(this.get('value'));"></select> 

       <select id="selB" name="selB" dojoType="dijit.form.Select" style="width: 180px; "></select> 

       <script type="text/javascript"> 
         var menu = dojo.byId("selA"); 

         menu.addOption({value: "aaa", label: "aaa"},{value: "bbb", label: "bbb"}); 

       </script> 

     </body> 

</html> 

Когда я загружаю страницу в своем браузере, меню selA содержит параметры aaa и bbb. Но selB, когда я выбираю aaa или bbb в selA, остается пустым. В javascript-консоли ошибок я могу прочитать: dojo.byId [undefined] не является функцией. Я потратил много времени, пытаясь сделать эту работу (попробовал много альтернатив), но не повезло. Я могу только заполнить dojo select on onload events, а не onchange (связанный с другим select) или onclick (связанный с кнопкой). С помощью стандартных элементов выбора HTML все работает нормально. Что я могу сделать, чтобы исправить эту проблему?

Благодаря

ответ

0

Здесь более или менее ваш рабочий пример

<html> 
    <head> 
      <link href="js/dijit/themes/claro/claro.css" rel="stylesheet" type="text/css" /> 
      <script type="text/javascript" src="js/dojo/dojo.js" djConfig="isDebug: true, parseOnLoad: true"></script> 

      <script type="text/javascript"> 
        dojo.require("dijit.form.Select"); 
        function updateB(val){ 
          var menu = dijit.byId("selB"); 
          menu.options.lenght=0; 
          if(val=="aaa") 
            menu.addOption({value: "aa", label: "aa"}); 
          else 
            menu.addOption({value: "bb", label: "bb"}); 
        } 
        dojo.addOnLoad(function() 
        { 
         var menu = dijit.byId("selA"); 
         menu.addOption([{value: "aaa", label: "aaa"},{value: "bbb", label: "bbb"}]); 
        }); 
      </script> 
    </head> 

    <body> 
      <select id="selA" name="selA" dojoType="dijit.form.Select" style="width: 180px;" onchange="updateB(this.get('value'));"></select> 
      <select id="selB" name="selB" dojoType="dijit.form.Select" style="width: 180px; "></select> 
    </body> 

Что изменилось:

  • переехал код установки Sela Выберите для dojo.addOnLoad , Это необходимо, , потому что раньше, когда вы были опробованы , чтобы получить виджет selA, это было не полностью создано и dojo не удалось вернуть свой вид. Dojo создает свои виджеты после полной загрузки страницы. После он создает все, что он называет Функция addOnLoad. Таким образом, вы должны место в этой функции все ваши файлы инициализации .
  • Выберите тип диджетов, поэтому dijit.byId следует использовать вместо dojo.byId.
+0

Это сработало, спасибо! –

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