Abhängige select-felder

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Abhängige select-felder

    Erst Mal ein Hallo in die Runde, von einem Neuen, aus der Schweiz.

    Ich hab folgendes Anliegen:

    Es geht um ein Bestellformular.
    Ich habe 3 voneinander abhängige select-felder, das zweite vom ersten und das dritte vom zweiten. Befüllt werden sie aus einer mysql-Datenbank.
    Das funktioniert soweit einwandfrei.

    Damit kann ich nun einen Artikel bestellen, mit den select-Boxen "Lieferant", "Material" und "Grösse".

    Ich möchte nun das Formular erweitern, und zwar so, dass man mehrere Artikel vom selben Lieferanten auswählen kann, und zwar in der Art, dass man den Lieferanten nur einmal wählen muss.

    Bsp:

    Lieferant - Material - Grösse
    - Material - Grösse
    - Material - Grösse
    usw.


    So sieht mein bisheriger Code aus:

    <html>
    <head>
    <title>Bestellschein</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script language="javascript" type="text/javascript">


    function getXMLHTTP() { //fuction to return the xml http object
    var xmlhttp=false;
    try{
    xmlhttp=new XMLHttpRequest();
    }
    catch(e) {
    try{
    xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
    }

    catch(e){
    try{
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch(e1){
    xmlhttp=false;
    }


    }
    }

    return xmlhttp;
    }
    function getMat(lieferantId) {
    var strURL="findMat.php?lieferant="+lieferantId;
    var req = getXMLHTTP();

    if (req) {

    req.onreadystatechange = function() {
    if (req.readyState == 4) {
    // only if "OK"
    if (req.status == 200) {
    document.getElementById('materialdiv').innerHTML=req.responseText;
    } else {
    alert("There was a problem while using XMLHTTP:\n" + req.statusText);
    }
    }
    }
    req.open("GET", strURL, true);
    req.send(null);
    }

    }
    function getGeb(lieferantId,materialId) {
    var strURL="findGeb.php?lieferant="+lieferantId+"&material="+materialId;
    var req = getXMLHTTP();

    if (req) {

    req.onreadystatechange = function() {
    if (req.readyState == 4) {
    // only if "OK"
    if (req.status == 200) {
    document.getElementById('gebindediv').innerHTML=req.responseText;
    } else {
    alert("There was a problem while using XMLHTTP:\n" + req.statusText);
    }
    }
    }
    req.open("GET", strURL, true);
    req.send(null);
    }

    }
    </script>
    </head>

    <body align="center">
    <table align="center" border="0" cellspacing="0" cellpadding="0" style="font-family:verdana; font-size:11;>
    <form method="post" action="" name="form1">


    <tr>
    <td>


    <?php

    include ("db.php");


    $query="SELECT id,lieferant FROM lieferant ORDER BY lieferant ASC";
    $result=mysql_query($query);

    ?>

    <select style="width:150px" style="font-family:verdana; font-size:11; name="lieferant" onchange="getMat(this.value)">
    <option></option>
    <? while($row=mysql_fetch_array($result)) { ?>
    <option value=<?=$row['id']?>><?=$row['lieferant']?></option>
    <? } ?>
    </select></option>


    </td>


    <td><div id="materialdiv"><select style="width:250px" style="font-family:verdana; font-size:11; name="material"><>
    <option></option>
    </select></div></td>



    <td><div id="1"><input style="width:50px" style="font-family:verdana; font-size:11; name="1" value="Anz"></input></div></td>

    <td>&nbsp;x&nbsp;</td>


    <td><div id="gebindediv"><select style="width:130px" style="font-family:verdana; font-size:11; name="gebinde">
    <option></option>
    </select></div></td></td>

    <td><div id="2"><input style="width:100px" style="font-family:verdana; font-size:11; name="2" value="Farbton"></input></div></td>

    <td><div id="3"><input style="width:100px" style="font-family:verdana; font-size:11; name="3" value="Bemerkung"></input></div></td>


    </tr>


    </form>
    </table>
    </body>

    </html>

    Kann mir jemand von euch weiterhelfen? Besten Dank jedenfalls schon mal zum Voraus.