• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

.add is not a function - select-field mit inhalten füllen?

gruad23

Neues Mitglied
ich würde gerne meine beiden select-fields über javascript mit Inhalt füllen. Ich bekomme aber folgenden fehler in meinem firebug-addon:

p1.add is not a function
p1.add(o);

Was mache ich falsch? Ich bin wirklich totaler javascript-neuling. Programmiere zwar viel mit server-side-languages, aber javascript ist neuland und auch das DOM-modell. Mein script unten hab ich mir aus schnippseln im web zuasmmengestellt. Ich verstehe gut, was es tun sollte, aber warum er zu meinem p1 u p2 die add-methode nicht kennt, versteh ich nicht.

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<script type="text/javascript">

 windows.onload=fill_p;

       function fill_p() {
          var val_p = new Array("1","2");
          var lab_p = new Array("eins","zwei");
          var p1 = document.getElementById( 's1' );
          var p2 = document.getElementById( 's2' );
          var o = new Option;
          for (var i=0; i < val_p.length;i++){
              o.text=lab_p[i];
              o.value=val_p[i];
              try
                {
                  p1.add(o,null);
                  p2.add(o,null);
             }
             catch(ex)
             {
                p1.add(o);
                p2.add(o);
             }
      }
</script>
</head><body>
<form method="post">
<select name="s1"></select>
<select name="s2"></select>
</form>
</body>
</html>
danke für tips und hilfe,
p
 
- Es fehlt das schließende "}" der Funktion.
- "windows" muss "window" lauten.
- document.getElementById() sucht ein Element, na ja, nach ID, nicht nach Name.
- var o = new Option; müsste in die for-Schleife, da sonst das Setzen der nächsten Option den Inhalt der vorherigen überschreibt.
- p1.add(o,null); p2.add(o,null); Dasselbe Objekt kann offenbar nicht in zwei Listen stehen.

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<script type="text/javascript">

function createOption(text, value){
    var o = new Option;
    o.text = text;
    o.value = value;
    return o;
}

function fill_p() {
    var val_p = new Array("1","2");
    var lab_p = new Array("eins","zwei");
    var p1 = document.getElementById( 's1' );
    var p2 = document.getElementById( 's2' );

    for (var i=0; i < val_p.length;i++){
        try
        {
            p1.add(createOption(lab_p[i],val_p[i]),null);
            p2.add(createOption(lab_p[i],val_p[i]),null);
        }
        catch(ex)
        {
            p1.add(createOption(lab_p[i],val_p[i]));
            p2.add(createOption(lab_p[i],val_p[i]));
        }
    }
}

window.onload = fill_p;

</script>
</head><body>
<form method="post">
<select id="s1" name="s1"></select>
<select id="s2" name="s2"></select>
</form>
</body>
</html>
 
Zurück
Oben