首页 > 解决方案 > 如何从ajax post函数中检索多个数据?

问题描述

我有一个选择下拉列表和一些输入字段。我的目标是当我从下拉列表中选择任何选项时,它会获取它的值并将其插入到输入字段中,这就是 ajax post 函数

   <script>
        $(document).ready(function(){
            $('#productSelect').on('change',function(){
                var selectedValue = $('#productSelect').val();
                $.post('php/loadProducts.php', {
                    productId : selectedValue
                }, function(data, status) {
                    $('#id').val(data);
                    $('#name').val(data);
                    $('#price').val(data);
                });
            });
        });
    </script>

这就是“loadProdcut.php”文件中发生的事情

<?php

if (isset($_POST['productId'])) {
    $productId = $_POST['productId'];
    $sql = "SELECT * FROM products WHERE product_id = '$productId';";
    $result = mysqli_query($conn, $sql);
    $resultCheck = mysqli_num_rows($result);
    if ($resultCheck > 0) {
        while ($row = mysqli_fetch_assoc($result)) {
            $Id = $row['product_id'];
            echo $Id;
            $Name = $row['product_name'];
            echo $Name;
            $Price = $row['product_price'];
            echo $Price;
        }
    };
}
?>

现在,当我选择下拉列表的任何选项时,它会在每个输入字段中插入所有值(id、名称和价格),所以我想要实现的是将每个值放入它的输入字段中。

标签: phpjqueryajax

解决方案


从 AJAX 调用返回 JSON 到服务器更简单、更可靠,如果没有其他原因,然后一次性返回而不是多次回显

此外,准备好的语句可以保护您免受试图弄乱您的数据库的不良行为者的影响。

我假设当您使用 product_id 访问产品表时,只会返回一行,因此循环是不必要的

<?php

if (isset($_POST['productId'])) {
    
    // query with prameter ?
    $sql = "SELECT product_id, product_name, product_price 
            FROM products WHERE product_id = ?";
    // prepare it
    $stmt = $conn->prepare($sql):
    // bind the parameter to its data
    $stmt->bind_values('i', $_POST['productId']);
    $stmt->execute();

    // get resultset from the execution of the query
    $result = $stmt->get_result();

    $row = $result->fetch_assoc();

    //return the row (an array) converted to a JSON String
    echo json_encode($row);
}

现在你需要修改 javascript 来处理你刚刚返回的 nice 对象。

<script>
$(document).ready(function(){
    $('#productSelect').on('change',function(){
        var selectedValue = $('#productSelect').val();
        $.post('php/loadProducts.php', {productId : selectedValue}, function(data, status) {
            $('#id').val(data.product_id);
            $('#name').val(data.product_name);
            $('#price').val(data.product_price);
        });
    });
});
</script>

推荐阅读