动态添加更多字段包括2个动态下拉列表(类别下拉列表和产品下拉列表)和一个输入框以输入价格

时间:2018-04-02 09:27:05

标签: javascript php jquery ajax mysqli

我想动态填充两个下拉列表,这些下拉列表是从数据库和一个输入框中获取的 第一个下拉列表:填充类别 第二次下拉:根据类别,所有产品都包含在产品下拉列表中 输入框:输入价格

这三个字段是通过jQuery添加更多动态添加的 sample

1 个答案:

答案 0 :(得分:0)

<script type="text/javascript" src="js/jquery.min.js"></script>
<div class="">
    Category :
    <select name="category" id="category">
        <option value=''>------- Select --------</option>
        <?php 
        $sql = "select * from `categories`";
        $res = mysqli_query($con, $sql);
        if(mysqli_num_rows($res) > 0) {
            while($row = mysqli_fetch_object($res)) {
                echo "<option value='".$row->cat_id."'>".$row->cat_name."</option>";
            }
        }
        ?>
    </select>

    Products :
    <select name="products" id="products"><option>------- Select --------</option></select>
</div>


<script>$(document).ready(function() {
$("#category").change(function() {
    var product_id = $(this).val();
    if(product_id != "") {
        $.ajax({
            url:"get-products.php",
            data:{c_id:product_id},
            type:'POST',
            success:function(response) {
                var resp = $.trim(response);
                $("#products").html(resp);
            }
        });
    } else {
        $("#products").html("<option value=''>------- Select --------</option>");
    }
}); }); </script>