document.testform.unterrubrik.options[i] has no properties

mkoeni1 · 18. Juli 2008

Hallo,

ich habe ein Fromular und möchte ein dropdown Feld nach einer vorigen Auswahl auf Client Seite füllen:

PHP:

<form name="testform" action="testformular1.php" method="GET">
    Rubrik:
    <br />
            <select name="rubrik">
<!-- <option value="Haus" onclick="welcher_wert();"> -->
                    <option value="Haus" onclick="welcher_wert();">
                        Haus
                    </option>
                    <option value="Auto" onclick="welcher_wert();">
                        Auto
                    </option>
                    <option value="Garten" onclick="welcher_wert();">
                        Garten
                    </option>
                </szon:for-each>
            </select>

<div id="untershow" style="display: none; position: absolute; top: 150px; left: 10px;">
<table class="formtable">
    <tr>
        <td>
            Unterrubrik:
            <br />
        <select name="unterrubrik">
            <option id="urubrik" name="urubrik" value=""></option>
        </select>
        </td>
        <input id="text" type="text" name="sichbar" value="" />
        <input id="hidden" type="hidden" name="hidden" value="Haus" />
        <td class="td_white" >
        <input class="button_formtable" type="submit" name="action" value="Suchen"/>
        </td>
    </tr>
</table>

dazu habe ich folgende Javascript Funktion:

PHP:

<script type="text/javascript">
        function welcher_wert(){
            var allSelects = document.getElementsByTagName('select');
            var mySelect = allSelects['rubrik'];
            var myValue = mySelect.options[mySelect.selectedIndex].value;
            //alert(myValue);


            var unterrubrik = new Array(5);
            unterrubrik[0] = "Alles";
            unterrubrik[1] = "Kino";

            var unterrubrik1 = new Array(4);
            unterrubrik1[0] = "Sonstiges";
            unterrubrik1[1] = "Jazz";
            unterrubrik1[2] = "Blues/Rock/Pop";
            unterrubrik1[3] = "Musikschulen";

            var unterrubrik2 = new Array(9);
            unterrubrik2[0] = "Sonstiges";
            unterrubrik2[1] = "Tag der offenen Tür";
            unterrubrik2[2] = "Kurse/Seminare";
            unterrubrik2[3] = "Märkte";
            unterrubrik2[4] = "Weitere Gottesdienste";
            unterrubrik2[5] = "Parteien";
            unterrubrik2[6] = "Evang. Gottesdienste";
            unterrubrik2[7] = "Kath. Gottesdienste";
            unterrubrik2[8] = "Messen";
//        alert(unterrubrik2.length);
            


            // das hidden field
            var i = 0;
            for(i=0;i<unterrubrik2.length;++i){
                document.testform.urubrik.options[i].text = unterrubrik2[i];
            }
            if(document.getElementById("untershow").style.display=="none"){
                document.getElementById("untershow").style.display="block";
            }
            else{
                document.getElementById("untershow").style.display="none";
            }

            // hidden value mit Wert belegen
            //document.getElementsByTagName('hidden').value = "test";

            // seite neu laden
            //window.location.reload();
    }
</script>

Beim ausführen bekomme ich immer diesen Fehler:

Code:

document.testform.unterrubrik.options[i] has no properties

Kann mir jemand sagen, was ich hier falsch mache?

Gruß und Vielen Dank
Matthias

kuddeldaddeldu · 18. Juli 2008

Hi,

bist Du sicher, dass die Fehlermeldung genau so lautet? Ich kann nämlich kein

PHP:

document.testform.unterrubrik.options[i]

in Deinem Code finden, nur ein

PHP:

document.testform.urubrik.options[i]

und das ist natürlich falsch.

LG

mkoeni1 · 21. Juli 2008

Hallo,

es findet ein:

PHP:

document.testform.urubrik.options[i].value

statt das ist richtig.

Aber wieso ist das falsch, ich kann den Fehler nicht finden.
Könntest du mir etwas mehr verraten wo mein Denkfehler liegt?

Gruß und Danke
Matthias

Sven Mintel · 21. Juli 2008

mkoeni1 hat gesagt.:
Hallo,

es findet ein:

Code:

document.testform.urubrik.options[i].value

statt das ist richtig.

Weil es kein select-Element namens "urubrik" gibt, die Liste trägt den Namen "unterrubrik"....und diesen musst du dort notieren statt "urubrik"

mkoeni1 · 21. Juli 2008

Hallo,

ich bin doch nicht komplett blöde, oder? Das ist mein Code den ich habe und der wirft im Firebug leider immer noch den Fehler:

Code:

document.testform.unterrubrik.options[i] has no properties

Quellcode:

PHP:

    <?php
// Unterrubrik laden
$test1 = array(
            array( "id" => 99, "name" => "Alles"),
            array( "id" => 1, "name" => "Kino")
            );
$test2 = array(    
            array( "id" => 1, "name" => "Sonstiges"),
            array( "id" => 2, "name" => "Jazz"),
            array( "id" => 3, "name" => "Klassik"),
            array( "id" => 4, "name" => "Blues/Rock/Pop"),
            array( "id" => 5, "name" => "Musikschulen")
);
$test3 = array(    
            array( "id" => 1, "name" => "Sonstiges"),
            array( "id" => 2, "name" => "Tag der offenen Tür"),
            array( "id" => 3, "name" => "Kurse/Seminare"),
            array( "id" => 4, "name" => "Märkte"),
            array( "id" => 5, "name" => "Weitere Gottesdienste"),
            array( "id" => 6, "name" => "Parteien"),
            array( "id" => 7, "name" => "Evang. Gottesdienste"),
            array( "id" => 8, "name" => "Kath. Gottesdienste"),
            array( "id" => 9, "name" => "Messen")
);
$test4 = array(    
            array( "id" => 1, "name" => "Musical"),
            array( "id" => 2, "name" => "Freilichttheater"),
            array( "id" => 3, "name" => "Oper"),
            array( "id" => 4, "name" => "Kinder-u.Jugendtheater"),
            array( "id" => 5, "name" => "Kleinkunst"),
            array( "id" => 6, "name" => "Theater"),
            array( "id" => 7, "name" => "Sonstiges"),
            array( "id" => 8, "name" => "Ballett/Tanz"),
            array( "id" => 9, "name" => "Operette")
);
$test5 = array(    
            array( "id" => 1, "name" => "Ausstellungen"),
            array( "id" => 2, "name" => "Vernissagen"),
            array( "id" => 3, "name" => "Senioren"),
            array( "id" => 4, "name" => "Vorträge"),
            array( "id" => 5, "name" => "Kinder- u. Jugendtreffs"),
            array( "id" => 6, "name" => "Frauen"),
            array( "id" => 7, "name" => "Familie"),
            array( "id" => 8, "name" => "Jahrgänge")
);
$test6 = array(    
            array( "id" => 1, "name" => "Literatur")
);
$test7 = array(    
            array( "id" => 1, "name" => "Finissagen")
);
$test8 = array(    
            array( "id" => 1, "name" => "Bäder"),
            array( "id" => 1, "name" => "Hilfe und Beratung"),
            array( "id" => 2, "name" => "Sonstiges"),
            array( "id" => 3, "name" => "Müllabfuhr"),
            array( "id" => 4, "name" => "Museen"),
            array( "id" => 5, "name" => "Bibliotheken"),
            array( "id" => 6, "name" => "Rettungsdienste"),
            array( "id" => 7, "name" => "Apotheken"),
            array( "id" => 8, "name" => "Freizeitparks"),
            array( "id" => 1, "name" => "Allgemein Ärzte"),
            array( "id" => 1, "name" => "Wertstoffabgabe"),
            array( "id" => 2, "name" => "Zahnärzte"),
            array( "id" => 3, "name" => "Augenärzte"),
            array( "id" => 4, "name" => "Öffnungszeiten"),
            array( "id" => 5, "name" => "Tierärzte"),
            array( "id" => 6, "name" => "Polizei"),
            array( "id" => 7, "name" => "Krankenhäuser"),
            array( "id" => 8, "name" => "Hilfsdienste"),
            array( "id" => 6, "name" => "Telefonseelsorge"),
            array( "id" => 7, "name" => "Kinderärzte"),
            array( "id" => 8, "name" => "Blutspenden")
);


//var_dump($test8);

echo '<br />';


// Abfrage starten:
include('dbconnect.php');

    if(empty($_GET['rubrik'])){
        $abfrage = 'select user_id from users where kategorie like "Garten"';
        $ergebnis = mysql_query($abfrage) or die('keine Verbindung');
        while($row = mysql_fetch_object($ergebnis)){
                        // echo '<option value="'.$row->user_id.'">';
                       // echo $row->user_id.'<br />';
                        // echo '</option>';
                    }
    }
     else{
        //echo $_GET['hidden'];
    }

echo $afrage;


//nur wenn button geklickt wird, ist die Anfrage weggschickt
if($_GET['action'] == 'Suchen'){
    echo 'button geklickt';
    echo $_GET['unterrubrik'];
    
}
else{
    echo 'keinen Absende-Button geklickt';
}

?>

<script type="text/javascript">
        function welcher_wert(){
            var allSelects = document.getElementsByTagName('select');
            var mySelect = allSelects['rubrik'];
            var myValue = mySelect.options[mySelect.selectedIndex].value;
            //alert(myValue);


            var unterrubrik = new Array(2);
            unterrubrik[0] = "Alles";
            unterrubrik[1] = "Kino";

            var unterrubrik1 = new Array(4);
            unterrubrik1[0] = "Sonstiges";
            unterrubrik1[1] = "Jazz";
            unterrubrik1[2] = "Blues/Rock/Pop";
            unterrubrik1[3] = "Musikschulen";

            var unterrubrik2 = new Array(9);
            unterrubrik2[0] = "Sonstiges";
            unterrubrik2[1] = "Tag der offenen Tür";
            unterrubrik2[2] = "Kurse/Seminare";
            unterrubrik2[3] = "Märkte";
            unterrubrik2[4] = "Weitere Gottesdienste";
            unterrubrik2[5] = "Parteien";
            unterrubrik2[6] = "Evang. Gottesdienste";
            unterrubrik2[7] = "Kath. Gottesdienste";
            unterrubrik2[8] = "Messen";
//        alert(unterrubrik2.length);
            


            // das hidden field
            var i = 0;
            for(i=0; i<unterrubrik2.length; ++i){
                document.testform.unterrubrik.options[i].text = unterrubrik2[i];
            }
            if(document.getElementById("untershow").style.display=="none"){
                document.getElementById("untershow").style.display="block";
            }
            else{
                document.getElementById("untershow").style.display="block";
            }

            // hidden value mit Wert belegen
            //document.getElementsByTagName('hidden').value = "test";

            // seite neu laden
            //window.location.reload();
    }
</script>



<form name="testform" action="testformular1.php" method="GET">
    Rubrik:
    <br />
            <select name="rubrik">
<!-- <option value="Haus" onclick="welcher_wert();"> -->
                    <option value="Haus" onclick="welcher_wert();">
                        Haus
                    </option>
                    <option value="Auto" onclick="welcher_wert();">
                        Auto
                    </option>
                    <option value="Garten" onclick="welcher_wert();">
                        Garten
                    </option>
                </szon:for-each>
            </select>

<div id="untershow" style="display: none; position: absolute; top: 150px; left: 10px;">
<table class="formtable">
    <tr>
        <td>
            Unterrubrik:
            <br />
        <select name="unterrubrik">
            <option name="unterrubrik" value=""></option>
        </select>
        </td>
        <input id="text" type="text" name="sichbar" value="" />
        <input id="hidden" type="hidden" name="hidden" value="Haus" />
        <td class="td_white" >
        <input class="button_formtable" type="submit" name="action" value="Suchen"/>
        </td>
    </tr>
</table>
</div>

</form>






<?php

?>

Könnte mir das jemand richtig stellen?

Gruß und Vielen Dank
Matthias

Sven Mintel · 21. Juli 2008

Ich hab nirgends geschrieben, dass du die <option> in "unterrubrik" umbenennen sollst, du hast es getan und dadurch einen neuen Fehler erzeugt.

mkoeni1 · 22. Juli 2008

Hallo,

bin ich blöd?
Ich bekomme immernoch folgenden Fehler:

document.testform.unterrubrik.options[ i ] has no properties

Also nach der Definition laut de.selfhtml.org steht dort:

PHP:

document.Formularname.Elementname.Eigenschaft

Meines Erachtens müsste das dann bei mir so aussehen:

PHP:

document.testform.unterrubrik.options[i].text

mit dem Namen des Formulars und des Elements direkt über das document-Objekt (wie in Schema 2 / Beispiel 2)
Wie auch verschiedene andere Elemente mit name-Attributen können Sie Formulare mit Namen als Objekte direkt unterhalb des document-Objekts ansprechen. Dabei geben Sie mit document.Formularname.Elementname den Namen des Formulars und des Elements an, den Sie bei der Definition des Formulars und des Elements in den entsprechenden HTML-Tags im Attribut name angegeben haben.

Mein Script:

PHP:

<?php
// Unterrubrik laden
$test1 = array(
            array( "id" => 99, "name" => "Alles"),
            array( "id" => 1, "name" => "Kino")
            );
$test2 = array(    
            array( "id" => 1, "name" => "Sonstiges"),
            array( "id" => 2, "name" => "Jazz"),
            array( "id" => 3, "name" => "Klassik"),
            array( "id" => 4, "name" => "Blues/Rock/Pop"),
            array( "id" => 5, "name" => "Musikschulen")
);
$test3 = array(    
            array( "id" => 1, "name" => "Sonstiges"),
            array( "id" => 2, "name" => "Tag der offenen Tür"),
            array( "id" => 3, "name" => "Kurse/Seminare"),
            array( "id" => 4, "name" => "Märkte"),
            array( "id" => 5, "name" => "Weitere Gottesdienste"),
            array( "id" => 6, "name" => "Parteien"),
            array( "id" => 7, "name" => "Evang. Gottesdienste"),
            array( "id" => 8, "name" => "Kath. Gottesdienste"),
            array( "id" => 9, "name" => "Messen")
);
$test4 = array(    
            array( "id" => 1, "name" => "Musical"),
            array( "id" => 2, "name" => "Freilichttheater"),
            array( "id" => 3, "name" => "Oper"),
            array( "id" => 4, "name" => "Kinder-u.Jugendtheater"),
            array( "id" => 5, "name" => "Kleinkunst"),
            array( "id" => 6, "name" => "Theater"),
            array( "id" => 7, "name" => "Sonstiges"),
            array( "id" => 8, "name" => "Ballett/Tanz"),
            array( "id" => 9, "name" => "Operette")
);
$test5 = array(    
            array( "id" => 1, "name" => "Ausstellungen"),
            array( "id" => 2, "name" => "Vernissagen"),
            array( "id" => 3, "name" => "Senioren"),
            array( "id" => 4, "name" => "Vorträge"),
            array( "id" => 5, "name" => "Kinder- u. Jugendtreffs"),
            array( "id" => 6, "name" => "Frauen"),
            array( "id" => 7, "name" => "Familie"),
            array( "id" => 8, "name" => "Jahrgänge")
);
$test6 = array(    
            array( "id" => 1, "name" => "Literatur")
);
$test7 = array(    
            array( "id" => 1, "name" => "Finissagen")
);
$test8 = array(    
            array( "id" => 1, "name" => "Bäder"),
            array( "id" => 1, "name" => "Hilfe und Beratung"),
            array( "id" => 2, "name" => "Sonstiges"),
            array( "id" => 3, "name" => "Müllabfuhr"),
            array( "id" => 4, "name" => "Museen"),
            array( "id" => 5, "name" => "Bibliotheken"),
            array( "id" => 6, "name" => "Rettungsdienste"),
            array( "id" => 7, "name" => "Apotheken"),
            array( "id" => 8, "name" => "Freizeitparks"),
            array( "id" => 1, "name" => "Allgemein Ärzte"),
            array( "id" => 1, "name" => "Wertstoffabgabe"),
            array( "id" => 2, "name" => "Zahnärzte"),
            array( "id" => 3, "name" => "Augenärzte"),
            array( "id" => 4, "name" => "Öffnungszeiten"),
            array( "id" => 5, "name" => "Tierärzte"),
            array( "id" => 6, "name" => "Polizei"),
            array( "id" => 7, "name" => "Krankenhäuser"),
            array( "id" => 8, "name" => "Hilfsdienste"),
            array( "id" => 6, "name" => "Telefonseelsorge"),
            array( "id" => 7, "name" => "Kinderärzte"),
            array( "id" => 8, "name" => "Blutspenden")
);


//var_dump($test8);

echo '<br />';


// Abfrage starten:
include('dbconnect.php');

    if(empty($_GET['rubrik'])){
        $abfrage = 'select user_id from users where kategorie like "Garten"';
        $ergebnis = mysql_query($abfrage) or die('keine Verbindung');
        while($row = mysql_fetch_object($ergebnis)){
                        // echo '<option value="'.$row->user_id.'">';
                       // echo $row->user_id.'<br />';
                        // echo '</option>';
                    }
    }
     else{
        //echo $_GET['hidden'];
    }

echo $afrage;


//nur wenn button geklickt wird, ist die Anfrage weggschickt
if($_GET['action'] == 'Suchen'){
    echo 'button geklickt';
    echo $_GET['unterrubrik'];
    
}
else{
    echo 'keinen Absende-Button geklickt';
}

?>

<script type="text/javascript">
        function welcher_wert(){
            var allSelects = document.getElementsByTagName('select');
            var mySelect = allSelects['rubrik'];
            var myValue = mySelect.options[mySelect.selectedIndex].value;
            //alert(myValue);


            var unterrubrik = new Array(2);
            unterrubrik[0] = "Alles";
            unterrubrik[1] = "Kino";

            var unterrubrik1 = new Array(4);
            unterrubrik1[0] = "Sonstiges";
            unterrubrik1[1] = "Jazz";
            unterrubrik1[2] = "Blues/Rock/Pop";
            unterrubrik1[3] = "Musikschulen";

            var unterrubrik2 = new Array(9);
            unterrubrik2[0] = "Sonstiges";
            unterrubrik2[1] = "Tag der offenen Tür";
            unterrubrik2[2] = "Kurse/Seminare";
            unterrubrik2[3] = "Märkte";
            unterrubrik2[4] = "Weitere Gottesdienste";
            unterrubrik2[5] = "Parteien";
            unterrubrik2[6] = "Evang. Gottesdienste";
            unterrubrik2[7] = "Kath. Gottesdienste";
            unterrubrik2[8] = "Messen";
//        alert(unterrubrik2.length);
            


            // das hidden field
            var i = 0;
            for(i=0; i<unterrubrik2.length; ++i){
                document.testform.unterrubrik.options[i].text = unterrubrik2[i];
            }
            if(document.getElementById("untershow").style.display=="none"){
                document.getElementById("untershow").style.display="block";
            }
            else{
                document.getElementById("untershow").style.display="block";
            }

            // hidden value mit Wert belegen
            //document.getElementsByTagName('hidden').value = "test";

            // seite neu laden
            //window.location.reload();
    }
</script>



<form name="testform" action="testformular1.php" method="GET">
    Rubrik:
    <br />
            <select name="rubrik">
<!-- <option value="Haus" onclick="welcher_wert();"> -->
                    <option value="Haus" onclick="welcher_wert();">
                        Haus
                    </option>
                    <option value="Auto" onclick="welcher_wert();">
                        Auto
                    </option>
                    <option value="Garten" onclick="welcher_wert();">
                        Garten
                    </option>
                </szon:for-each>
            </select>

<div id="untershow" style="display: none; position: absolute; top: 150px; left: 10px;">
<table class="formtable">
    <tr>
        <td>
            Unterrubrik:
            <br />
        <select name="unterrubrik">
            <option name="urubrik" name="urubrik" value=""></option>
        </select>
        </td>
        <input id="text" type="text" name="sichbar" value="" />
        <input id="hidden" type="hidden" name="hidden" value="Haus" />
        <td class="td_white" >
        <input class="button_formtable" type="submit" name="action" value="Suchen"/>
        </td>
    </tr>
</table>
</div>

</form>






<?php

PS: Bin ich von allen guten Geistern verlassen? Ich möchte gerne die DIV Box einblenden und in dem DropDown Feld alle Werte einlesen.

Gruß Matthias

Sven Mintel · 22. Juli 2008

Jetzt hast du zumindest bei der Benennung der Liste alles korrekt, der Fehler lauert jetzt hier:

Code:

for(i=0; i<unterrubrik2.length; ++i){
                document.testform.unterrubrik.options[i].text = unterrubrik2[i];
            }

unterrubrik2 hat 9 Elemente, die Liste jedoch nur 1....nach dem ersten Schleifendurchlauf versucht deine Funktion auf document.testform.unterrubrik.options[1] zuzugreifen, welches nicht existiert.

Du musst neue <option>'s in die Liste einfügen, wie das geht, steht hier: http://de.selfhtml.org/javascript/objekte/options.htm#neue_elemente

mkoeni1 · 29. Juli 2008

Hallo Sven,

ich habe das jetzt gelöst:

PHP:

<form name="form1" method="get" action="ergebnis.html">
<table><tr>
        <td>
    Rubrik:
    <br />
            <select name="auswahl" onchange="update_auswahl()">
                <szon:for-each value-of="rubrik">
                    <option value="">
                        <?php foreach($wert as $w){
                            echo '<option value="'.$w.'">'.$w.'</option>';
}?>
                    
                </szon:for-each>
            </select>
        </td>
        <td>
    Unterrubrik:
    <br />
            <select name="unterrubrik">
                <option value="">Alles</option>
            </select>
        </td>
    </tr>
    <tr>
        <td colspan="2" class="td_white" style="position: relative; top: 150px; left: 10px;">
            <input class="button_formtable" type="submit" name="action" value="Suchen"/>
        </td>
    </tr>
</table>
</form>

und die Verarbeitung in Javascript:

PHP:

<script type="text/javascript">
    function update_auswahl()
{
    var kategorieAuswahl = document.forms.form1.auswahl;
    var unterkategorieAuswahl = document.forms.form1.unterrubrik;
    unterkategorieAuswahl.options.length = 0; // DropDown Menue entleeren
    if(kategorieAuswahl.options[kategorieAuswahl.selectedIndex].value == "99")
    {
           unterkategorieAuswahl.options[0] = new Option("Kino");
        unterkategorieAuswahl.options[1] = new Option("Sonstiges");
        unterkategorieAuswahl.options[2] = new Option("Jazz");
        unterkategorieAuswahl.options[3] = new Option("Blues/Rock/Pop");
}
}
</script>

Nachdem ich jetzt auf der Client Seite die Optionen ausgebe möchte ich auf der Server Seite auch damit arbeiten.
ZB. Klick jemannd einen Wert im Drop Down, bspw.

PHP:

unterkategorieAuswahl.options[0] = new Option("Kino");

Wie kann ich jetzt nach dem Absenden mit diesem Wert (zweites Select) mit PHP verarbeiten? $_POST/$_GET

Gruß und Vielen Dank
Matthias

Sven Mintel · 29. Juli 2008

Der gesendete Wert sollte per $_GET['unterrubrik'] ermittelbar sein.

document.testform.unterrubrik.options[i] has no properties

mkoeni1

Erfahrenes Mitglied

kuddeldaddeldu

Erfahrenes Mitglied

mkoeni1

Erfahrenes Mitglied

Sven Mintel

Mitglied

mkoeni1

Erfahrenes Mitglied

Sven Mintel

Mitglied

mkoeni1

Erfahrenes Mitglied

Sven Mintel

Mitglied

mkoeni1

Erfahrenes Mitglied

Sven Mintel

Mitglied

Neue Beiträge