Select Feld 1 soll Werte des 2. Feldes ändern

Headymaster

Erfahrenes Mitglied
Hallo,

Also ich möchte gerne, dass bei Auswahl in einem Select Feld im 2. Select Feld die zugehörigen Werte geladen werden.
Ich habe mich mal umgeschaut und dazu ein kleines Script geschrieben, was leider nocht nicht so das tut was es soll.
So sieht das Script erstmal aus:
Code:
/**
 * Fills a select field with data connected to the select field one
 */
function updateSelect(objSel1, objSel2, data) {
   // Delete the Options of the ObjectSelect2
   objSel2.length = 0;
   
   // If no Option is selected
   if (objSel1.selectedIndex == 0) {
       objSel2.style.display = "none";
   } else {
       objSel2.style.display = "inline";
   }
   
   // Read out the Options for the selected Value
   for (i=0; i<data[objSel1.selectedIndex].length; i++) {
        // Create new Option
        objOpt = new Option(data[objSel1.selectedIndex][i], data[objSel1.selectedIndex][i], false, false);
        // Add Option to the Select2 Object
        objSel2.options[objSel2.length] = objOpt;
   }
}

So also kleine Einführung
- objSel1 ist die "id" des ersten Select Feldes
- objSel2 ist die "id" des zweiten Select Feldes
- data enthält ein 2-Dimensionales Array mit den Werten für Feld 1 und Feld 2

---> Sieht so aus zum Beispiel:
Code:
array(3) {
  ["main"] => array(5) {
    [0] => string(10) "Startseite"
    [1] => string(14) "G&auml;stebuch"
    [2] => string(5) "Forum"
    [3] => string(9) "Userliste"
    [4] => string(4) "Test"
  }
  ["misc"] => array(2) {
    [0] => string(7) "Kontakt"
    [1] => string(9) "Impressum"
  }
  ["test"] => array(1) {
    [0] => string(15) "Ansprechpartner"
  }
}

So das Array wird mittels PHP an die Javascript funktion übergeben, welche ich so aufrufe:
HTML:
<select id="idKat" onChange="updateSelect('idKat', 'idParent', $this->tree);">
</select>

Die Optionene lese ich vorher natürlich auch inner Schleife ein.

Also Problem ist folgendes:

Ich bekomme den Fehler "objSel2.style has no properties" und außerdem bekomme ich auch den Fehler "data[objSel1.selectedIndex] has no propereties"

Würde mich freuen wenn ihr mir da ma helfen könntet :)

MFG Nilson
 
Zuletzt bearbeitet:
Hi,

wenn in objSel1 und objSel2 die IDs der Selectfelder als Strings vorliegen, musst du zunächst die Objekte der Selektelemente ermitteln.
Code:
/**
 * Fills a select field with data connected to the select field one
 */
function updateSelect(objSel1, objSel2, data) {
  // Objekte der ersten und zweiten Selectgruppe ermitteln
  var objS1 = document.getElementById(objSel1);
  var objS2 = document.getElementById(objSel2);

  // Delete the Options of the ObjectSelect2
  objS2.length = 0;

  // If no Option is selected
  if (objS1.selectedIndex == 0) {
    objS2.style.display = "none";
  } else {
   objS2.style.display = "inline";
  }

  // Read out the Options for the selected Value
  for (i=0; i<data[objS1.selectedIndex].length; i++) {
    // Create new Option
    objOpt = new Option(data[objS1.selectedIndex][i], data[objS1.selectedIndex][i], false, false);
    // Add Option to the Select2 Object
    objS2.options[objS2.length] = objOpt;
  }
}
Vielleicht hilft dir das weiter.

Ciao
Quaese
 
ah super das hat schon mal geholfn.

Ich hbae nun nur noch das Problem, dass anscheinend das Array das ich mit PHP an die javascript funktion übergebe, in der Javascript Funktion nicht benutzt werden kann.

Sprich ich bekomme den Fehler "data[objS1.selectedIndex] has no propereties"

MFG Nilson
 
Hi, danke für die schnelle antwort

Also du hast recht ich bekomme bei objS1.selectedIndex nen Integer wert, obwohl es ein String sein sollte....

Nach dem Auslesen mittels PHP steht dies in meinem Template drinne:
HTML:
<select onchange="updateSelect("idKat", "idParent", Array)" id="idKat" name="idKat">
	<option label="main" value="main">main</option>
	<option label="misc" value="misc">misc</option>
	<option label="test" value="test">test</option>
</select>

Warum bekomme ich aber nen Integer wert und nicht nen String?

MFG Nilson
 
Hi,

hast du das Array in ein korrektes JS-Array überführt?

Beispiel:
Code:
<?php
$myArr = array (
  "main" => array (
    "Startseite",
    "G&auml;stebuch",
    "Forum",
    "Userliste",
    "Test"
  ),
  "misc" => array (
    "Kontakt",
    "Impressum"
  ),
  "test" => array (
    "Ansprechpartner"
  )
);

echo("<script type=\"text/javascript\">\n");
echo("var arrTest = new Array();\n");
$intZaehler = 0;
foreach($myArr as $strKey => $arrInner){
  echo("arrTest[".$intZaehler."] = new Array();\n");
  for($i=0; $i<count($arrInner); $i++){
    echo("arrTest[".$intZaehler."][".$i."] = \"". $arrInner[$i] ."\";\n");
  }
  $intZaehler++;
}
echo("</script>\n");
?>

Wie sieht das Array denn aus, wenn du es z.B. in einer Alertbox ausgibst?
Code:
alert(arrTest.join('\n'));
Ciao
Quaese
 
Also wenn ich mein momentanes Array mit alert ausgebe bekomme ich folgendes:
Code:
function Array() {
    [native code]
}

Also muss ich das PHP-Array erst in Javascript "umwandeln" bevor ich es nutzen kann?

MFG Nilson
 
Wenn du über die value Eigenschaft auf die Listbox zugreifst, sollte der value Wert der ausgewählten Eigenschaft zurückgegeben werden.

Also objS1.selectedIndex durch objS1.value ersetzen.

Falls du natürlich das Array nur im PHP Code deklariert hast, dann kann JS darauf nicht zugreifen, da hat Quaese Recht. Das gehört natürlich zusätzlich gemacht.
 
Zuletzt bearbeitet:
Ja habe es nur PHP seitig deklariert.... :(....muss ich mal schauen wie ich das auch sauber ins Template reinkriege, weil ich schreib mich hier wusselig mit meinem MVC und habe dann nacher doch Logik im View....ne das geht nicht^^

MFG Nilson
 

Neue Beiträge

Zurück