自动填充动态生成的表单

Question

我构建了一个表单，可以从MySQL数据库中选择数据，并且所选行的所需字段将显示在表单的输入字段中。然而，这种形式是动态的，你可以有多种形式的相同形式。

如果生成两个或多个表单，则只会自动填充第一个表单。我希望每个表单在从数据库中选择一行时自动填充其对应的输入字段。

下面是代码：

<?php 
$start=1; 
$end= $_POST['item']; echo'<br>'; 

for($start;$start<=$end;$start++){ 

require("connect.php"); 

$sql = "(SELECT * FROM drug_name)"; 


$result = mysqli_query($conn, $sql); 


?> 
<form align="center" method="post" action="transaction.php"> 


     Name: 
     <select align="right" name="inputname[]" onchange="showunit(this.value); showqty(this.value)" 
value="inputvalue[]"> 
<option selected="selected" value="0">S/N Select drug --</option> 

<?php while($row = $result->fetch_assoc()){ ?> 

<option value='<?php echo $row['SN']; ?>'><?php  

echo$row['Drug_Item_Name']?></option> 

     <?php 
} 
    ?>  

     </select> 



     <td align="right">Stock Level:</td> 
     <td><input type="text" name="input3[]" placeholder="Enter QTY" size="5" id="displayqty"></td> 
     </tr> 


<?php  echo '<br>'; ?> 

<?php } 

?> </form> 

这是代码，以使AJAX代码：

 <script> 
     function showqty(str) { 

      if (str == "") { 
     document.getElementById("displayqty").value = "";  
       return; ` 
      } else {  
       if (window.XMLHttpRequest) { 




        // code for IE7+, Firefox, Chrome, Opera, Safari 
        xmlhttp = new XMLHttpRequest(); 
       } else {  
        // code for IE6, IE5 
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
       } 
       xmlhttp.onreadystatechange = function() { 
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
         document.getElementById("displayqty").value = xmlhttp.responseText; 
        } 
       } 
       xmlhttp.open("GET","qtydisplay.php?q2="+str,true); 
       xmlhttp.send(); 
      } 
     } 


     </script> 

这是AJAX代码来获取从MySQL数据库中的数据：

 <?php 

     $q2 = intval($_GET['q2']); 
     include("connect.php");//connection to database 


     mysqli_select_db($conn,"ajax_demo"); 
     $sql="SELECT Qty_Stocked FROM drug_name WHERE SN = '".$q2."' LIMIT 1"; 
     $result = mysqli_query($conn,$sql); 


     while($row = mysqli_fetch_array($result)) { 
      echo $row['Qty_Stocked']; 
     } 

     mysqli_close($conn); 
     ?> 

Answer 1

以下是我如何解决这个问题。我已经在评论中给出了所有这些信息，但是如果我以编号的方式列出它，这可能会有所帮助，因此它是毫不含糊的。在这里避免跳过项目可能是最好的，因为每个任务都依赖于前一项任务。

1. 第一个任务是修复您的重复id属性。考虑你的循环中的HTML：

   <td> 
       <input type="text" name="input3[]" 
         placeholder="Enter QTY" size="5" id="displayqty"> 
   </td> 
   

   这会给你多个输入标签与唯一标识冲突。你可以在这里使用一个整数，还是$row['SN']呢？如果该值是唯一的，你可以做这样的事情：

   <td> 
       <input type="text" name="input3[]" 
         placeholder="Enter QTY" size="5" 
         id="displayqty_<?php echo (int) $row['SN'] ?>" 
       > 
   </td> 
   

   （我是被迫为安全起见int，但如果它被定义为数据库中的一个整数，你不需要这个）。

   一旦您修改了代码来为您的id属性呈现唯一名称，请查看您生成的HTML并确保它能正常工作。

2. 然后您需要修改您的JavaScript函数，以便您可以告诉它使用什么id。由于它目前硬连线到displayqty它只会修改最多一个元素，这不是你想要的。尝试切换这样的：

   function showqty(str) 
   

   这样：

   function showqty(str, id) 
   

   然后，您可以使用该变量id而不是"displayqty"在你的函数。

3. 最后为了将它们连接在一起，您的更改处理程序需要传递目标id。更改此：

   showqty(this.value) 
   

   到任何字符串时使用的id之前。例如，也许这个？

   showqty(this.value, "displayqty_<?php echo (int) $row['SN'] ?>") 
   

记住，这不是测试，我只是有一个什么样的画面在这里做一个偶然的想法。如果没有一点调整和调试你的最终目标，不要指望它能够正常工作 - 如果你愿意坚持下去，你就会到达那里。祝你好运！