自动填充动态生成的表单

时间:2015-07-12 15:37:27

标签: php html mysql forms

我构建了一个可以从MySQL数据库中选择数据的表单,所选行的所需字段将显示在表单的输入字段中。但是,这种形式是动态的,因为您可以拥有相同形式的多种形式。

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

Illustration of forms

以下是代码:

<?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>

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

        <?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);
        ?>

1 个答案:

答案 0 :(得分: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'] ?>")
    
  4. 请记住,这没有经过测试,我只是对你的屏幕在这里所做的事情有所了解。不要指望这可以在没有一点调整和调试结束的情况下工作 - 如果你愿意坚持下去,你就会到达那里。祝你好运!