2011-01-03 5 views
0

Ich habe einige Probleme mit dijit.form.Wählen Sie Elemente.Dojo js Toolkit: Problem mit dynamisch gefüllt wählen

In einer Seite habe ich zwei dieser Elemente: eines ist gefüllt, während die HTML-Seite geladen wird und das andere ist abhängig davon, welche Option der Benutzer auf der ersten ausgewählt hat.

Hier ist ein Beispiel dafür, was ich meine (jetzt ich den Code einfach bin zu halten, aber in der realen Version Ich habe alle notwendigen Dojo Module und Bibliotheken im Kopfteil im Lieferumfang enthalten):

<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> 

Wenn ich die Seite in meinem Browser lade, enthält Menü selA die Optionen aaa und bbb. Aber selB, wenn ich aaa oder bbb in selA auswähle bleibt leer. In der Javascript-Fehlerkonsole kann ich lesen: dojo.byId [undefined] ist keine Funktion. Ich habe viel Zeit damit verbracht, diese Arbeit zu machen (es gab viele Alternativen), hatte aber kein Glück. Ich kann Dojo Select nur bei Onload-Events füllen, nicht bei Onchange (verbunden mit einem anderen Select) oder Onclick (assoziiert mit einem Button). Mit Standard-HTML-Elementen wählen Sie alles funktioniert ok. Was kann ich tun, um dieses Problem zu beheben?

Dank

Antwort

0

Hier ist mehr oder weniger Ihrem Arbeitsbeispiel

<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> 

Was ich geändert haben:

  • Code bewegt, dass das Setup Sela Wählen Sie zum dojo.addOnLoad . Dies ist erforderlich, , denn zuvor, als Sie versucht wurden, SelA Widget zu bekommen, war es nicht vollständig erstellt und Dojo konnte seine Widget noch nicht zurückgeben. Dojo erstellt seine Widgets nachdem die Seite vollständig geladen ist. Nach erstellt es alles, was es ruft addOnLoad Funktion. So sollten Sie Platz in dieser Funktion all Ihre Initialisierung Zeug.
  • Wählen Sie eine Dijit Art von Widget so dijit.byId sollte anstelle von dojo.byId verwendet werden.
+0

Es hat funktioniert, danke! –