如何从数据库中获取Textbox中的值取决于没有提交按钮的下拉列表

时间:2017-05-29 09:05:02

标签: javascript php

我想从数据库获取文本框值取决于下拉列表值而不使用提交按钮。现在我的代码上有三个下拉列表。我可以编写三个下拉列表的javascript

<div align="center">
<table>
<thead>
<th>Product</th>
<th>Quantity</th>
<th>Rate</th>
<th>Amount</th>
</thead>
<tbody>
    <tr id="addrow">
    <td>
    <?php
    $selectproduct=mysql_query("select productname from items");
    $itemname=mysql_fetch_array($selectproduct);
    ?>
    <select name="item[]" id="item">

    <?php
    $i=0;
    while($itemname=mysql_fetch_array($selectproduct))
    {
    ?>
      <option value="<?php echo $itemname['productname'];?>"><?php echo $itemname['productname'];?></option>
      <?php
     $i++;
    }
    ?>
    </td>
    <?php

 //    $amount=mysql_query("select Amount from items where Productname='$productname' ");
   //  $totalamount=mysql_fetch_array($amount);
    ?>


    <td><input class="qty" type="text" name="qty[]"></td>
    <td><input class="price" type="text" name="price[]"></td>
    <td><input type="text" class="output" name="output[]"></td>
    </tr>
    <tr >
    <td>
    <?php
    $selectproduct=mysql_query("select productname from items");
    $itemname=mysql_fetch_array($selectproduct);
    ?>
    <select name="item[]" id="item">

    <?php
    $i=0;
    while($itemname=mysql_fetch_array($selectproduct))
    {
    ?>
      <option value="<?php echo $itemname['productname'];?>"><?php echo $itemname['productname'];?></option>
      <?php
     $i++;
    }
    ?>
    </td>

    <td><input class="qty" type="text" name="qty[]"></td>
    <td><input class="price" type="text" name="price[]"></td>
    <td><input type="text" class="output" name="output[]"></td>
    </tr>
    <tr>
    <td>
    <?php
    $selectproduct=mysql_query("select productname from items");
    $itemname=mysql_fetch_array($selectproduct);
    ?>
    <select name="item[]" id="item">

    <?php
    $i=0;
    while($itemname=mysql_fetch_array($selectproduct))
    {
    ?>
      <option value="<?php echo $itemname['productname'];?>"><?php echo $itemname['productname'];?></option>
      <?php
     $i++;
    }
    ?>
    </td>

   <td><input class="qty" type="text" name="qty[]"></td>
    <td><input class="price" type="text" name="price[]"></td>
    <td><input type="text" class="output" name="output[]"></td>
    </tr>
</table>
<div id="grand">
Total Amount:<input type="text" name="gran" id="gran">
</div>
    </tr>
    <tr >
    <td colspan="4">
    <center><input type="submit" name="submit"></center>
    </td>
    </tr>
</tbody>
</table>
</div>
</form>
</body>
<script type="text/javascript">
    $(document).ready(function() {
    $(".price").keyup(function() {
        var grandTotal = 0;
        $("input[name='qty[]']").each(function (index) {
            var qty = $("input[name='qty[]']").eq(index).val();
            var price = $("input[name='price[]']").eq(index).val();
            var output = parseInt(qty) * parseInt(price);

            if (!isNaN(output)) {
                $("input[name='output[]']").eq(index).val(output);
                grandTotal = parseInt(grandTotal) + parseInt(output);    
                $('#gran').val(grandTotal);
            }
        });
    });
}); 
</script>

2 个答案:

答案 0 :(得分:0)

我建议您使用jQuery开始。操作DOM更容易。 按照教程,然后在下拉菜单上附加更改事件的回调,然后在回调中获取ajax调用中菜单的值,然后生成html(选项标记)并更新您的选择。

Ajax调用和html更新可以使用jQuery完成,但你也可以在纯Javascript中自己完成。

答案 1 :(得分:0)

您需要使用JS的AJAX调用。 AJAX必须从php脚本发送和接收数据。简单的AJAX教程:https://www.w3schools.com/js/js_ajax_php.asp