Ankündigung

Einklappen
Keine Ankündigung bisher.

Wie bekommt man Werte aus einer option-Liste in konsekutive input-Felder

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Wie bekommt man Werte aus einer option-Liste in konsekutive input-Felder

    Hallo,

    ich habe ein HTML-Formular, mit dem man Daten aus einer Datenbank auslesen kann. Es gibt auch die Möglichkeit mittels Javascript-Funktion zusätzliche input-Felder für die Abfrage zu erzeugen. Hier ist mein Code, der auch wunderbar funktioniert:


    HTML-Code:
    <table>
    <tr><td>
    <input type="text" id="productinput" name="productinput[]" class="awesomplete" list="productselect" size="20"/>
    </td></tr>
    <tr><td>
    <input type="text" id="productinput2" name="productinput[]" class="awesomplete" list="productselect" size="20"/>
    </td></tr>
    <tr><td>
    <input type="text" id="productinput3" name="productinput[]" class="awesomplete" list="productselect" size="20"/>
    </td></tr>
    </table>
    Code:
        <script>
        var counter = 1;
    
        var limit = 10;
    
        function addInput(divName){
    
             if (counter == limit)  {
    
                  alert("You have reached the limit of adding " + counter + "  
        inputs");
    
             }
    
             else {
    
        // Create new div  
         var newdiv = document.createElement('div');  
         newdiv.innerHTML = '<br><input type="text" name="productinput[]" class="awesomplete" list="productinputselect" size="20"/>';  
         document.getElementById(divName).appendChild(newdiv);  
    
         // Re instantiate Awesomplete  
         new Awesomplete(newdiv.querySelector('input'), { list: document.querySelector('#productinputselect') });  
    
         // Set counter  
         counter++;  
             }
    
        }
        </script>

    HTML-Code:
    <div id="dynamicInput">
    <b></b><input type="text" id="productinput4" name="productinput[]" class="awesomplete" list="productinputselect" size="20"/>
    </div>
    <input type="button" value="Additional Input Field" onClick="addInput('dynamicInput');">
    
    
    <select name="productselect" id="productselect" size="9" onclick="sendproductnameinput()">
    PHP-Code:

    <?php
    include("../files/zugriff.inc.php");                    // database access

    $sql "SELECT * FROM product_main ORDER BY Name";
    $result mysqli_query($db$sql);
    while (
    $row mysqli_fetch_assoc($result)) {
      echo 
    '<option class="optproducts" value='$row['Name'] . '>' $row['Name']. '</option>';
      echo 
    '<br>';
    }
    mysqli_close($db);
    ?>
    HTML-Code:
    </select>

    Mit der folgenden Javascript-Funktion wird der in der option-Liste gewählte Wert im ersten input-Feld angezeigt.

    Code:
    function sendproductnameinput() {
    document.formdatabase.productinput.value = document.formdatabase.productselect.value;
    }
    Wie bekomme ich nun den nächsten gewählten Wert in das 2. input-Feld usw.? Und in weiterer Folge auch in die zusätzlich erzeugten input-Felder?

    Vielen Dank für Eure Hilfe!
Lädt...
X