Как загрузить несколько данных поля ввода с помощью одного вызова AJAX?

Question

Я хочу загрузить название продукта и цену, выбрав код продукта. но я не могу. Я пытаюсь так, но покажу имя и цену в одном поле.

Это мой код HTML-страницы.

<select name="" id="" class="code">
    <option value="">Select</option>
<?php
    $db = new mysqli("localhost","root","","test");

    $select = $db->query("select code from product");

    while (list($code) = $select->fetch_row()) {
        echo "<option value='$code'>$code</option>";
    }
?>
</select> <input type="text" class="name"> <input type="text" class="price">

<script>
    $(function(){
        $(".code").change(function(){
            var code = $(this).val();
            $.ajax({
                url : 'select.php',
                method : 'POST',
                data : {code:code},
                success : function(echo){
                    $('.name').val(echo);
                    $('.price').val(echo);
                }
            });

        });
    })
</script>

Это php код

<?php
$db = new mysqli("localhost","root","","test");

$code = $_POST["code"];

$select = $db->query("select name, price from product where code='$code'");

list($name, $price) = $select->fetch_row();
echo $name;
echo $price;

?>

Answer 1

вы должны вернуть данные в формате JSON, а затем вы можете получить их в ответ на AJAX

<?php
echo json_encode(['name'=>$name,'price'=>$price]);

?>

ваш скрипт:

<script>
    $(function(){
        $(".code").change(function(){
            var code = $(this).val();
            $.ajax({
                url : 'select.php',
                method : 'POST',
                data : {code:code},
                success : function(echo){
                    $('.name').val(echo.name);
                    $('.price').val(echo.price);
                }
            });

        });
    })
</script>