使用 jquery 根据下拉选择使用 mysql 值自动填充两个输入字段数据

问题描述 投票:0回答:0

在此代码中,当包下拉选择选项价格和安装费字段时应自动填充。但它不起作用。

        <div class="form-group" id="" >
            <label for="class_no" class="control-label col-lg-3">Packages</label>
            <div class="col-lg-5" >
                <select class="form-control search" id="PACKAGES_NO" name="PACKAGES_NO" style="width: 100%">
                    <option value="-1">--Select One--</option>
                </select> 
                 <P class="error_message" id="PACKAGES_NO"></P>    
            </div>
        </div>
        <div class="form-group">
            <label for="PRICE" class="control-label col-lg-3">Price</label>
            <div class="col-lg-5">
                <input class="form-control" id="PRICE" name="PRICE" type="text" 
                  readonly/> 
            </div>
        </div>
        <div class="form-group">
            <label for="INSTALLATION_FEE" class="control-label col-lg-3">Installation Fee</label>
            <div class="col-lg-5">
                <input class="form-control" id="INSTALLATION_FEE" name="INSTALLATION_FEE" type="text" 
                  readonly/>
                   <P class="error_message" id="RATE_ERROR"></P>
            </div>
        </div>

** 使用 ajax 从数据库填充数据 **

$("#DISTRICT_NO").on("change",function(){
            var DISTRICT_NO = $(this).val();
            if(DISTRICT_NO!= -1){
                $.post("ajax/ref_packages.php",{DISTRICT_NO:DISTRICT_NO},function(data){
                   // console.log(data.trim().length);
                    $("#PACKAGES_NO").html(data);
                       
                    
                });


            }else{
                $("#PACKAGES_NO").html("<option value='-1'>--Select One--</option>");
                
            }
 });

通过选择套餐下拉列表显示价格和安装费数据

$('#PACKAGES_NO').on('change',function(){
            var PACKAGES_NO = $(this).val();
            if (PACKAGES_NO != -1) {
                $.ajax({
                    url: 'user_packages.php',
                    type: 'POST',
                    data: {PACKAGES_NO: PACKAGES_NO},
                    dataType: 'json',
                    success: function(data) {
                    userData = json.parse(data);
                    $('#PRICE').val(userData.PRICE);
                    $('#INSTALLATION_FEE').val(userData.INSTALLATION_FEE);
                    }
                });
            } else {
                $('#PRICE').val("");
                $('#INSTALLATION_FEE').val("");
            }
});

user_packages.php 文件

include('../../config/db_connection.php');
        $PACKAGES_NO = $_POST["PACKAGES_NO"];
        $sql="SELECT * FROM `packages` WHERE `IS_DELETED`=0 AND `PACKAGES_NO`='$PACKAGES_NO' ";
        $query = mysqli_query($con,$sql);

        $row = mysqli_fetch_array($query);
        echo json_encode($row);

        exit();
php jquery ajax
© www.soinside.com 2019 - 2024. All rights reserved.