如何在 php 的 ajax 调用函数中传递 2 个参数？答案

【问题标题】：How can I pass 2 parameter in ajax call function in php?如何在 php 的 ajax 调用函数中传递 2 个参数？
【发布时间】：2021-03-11 10:37:15
【问题描述】：

我正在创建一个表格变化函数，用户可以在其中根据他们选择的颜色选择尺寸。

这是我的变体表

|id | product_id | product_qty | product_colour | product_size
|1  |  1         |   30        |   red          |    23
|2  |  1         |   24        |   blue         |    34
|3  |  1         |   12        |   blue         |    23
|4  |  2         |   23        |   yellow       |    12
|5  |  2         |   1         |   white        |    12

产品 id 是根据 url 获取的。

下面是我选择颜色的功能。

用户在选择颜色后必须先选择颜色，尺寸选项值将根据选择的颜色显示。

但我在 ajax 调用中传递多个参数时遇到问题。我想在我的 ajax 调用中传递 product_id，并获取产品 id 值，然后在我的ajaxpro.php 中使用它。我不确定如何在ajax调用函数中传递product_id值。

  <div class="panel-heading">Select Colour and get size</div>
      <div class="panel-body">
            <div class="form-group">
                <label for="title">Select Colour:</label>
                <select name="product_colour" class="form-control">
                    <option value="">--- Select Colour ---</option>


                    <?php
                        require('config.php');

                        $sql = $link ->prepare("SELECT DISTINCT product_colour, product_id FROM variation
                                               WHERE product_id = ? ");
                        $sql->bind_param("i", $_GET["mid"]);
                        $sql->execute();
                        $result = $sql->get_result();
                        while($row = $result->fetch_assoc()) {
        
                            $product_id = $row['product_id'];
                            
                            echo "<option value='".$row['product_colour']."'>".$row['product_colour']."</option>";      
                        }

                       
                    ?>


                </select>
            </div>

            <div class="form-group">
                <label for="title">Select Size:</label>
                <select name="product_size" class="form-control" style="width:350px">
                </select>
            </div>

<script>
$( "select[name='product_colour']" ).change(function () {
    var ColourID = $(this).val();
    

    if(ColourID) {


        $.ajax({
             url: "ajaxpro.php",
            dataType: 'Json',
            data: {'product_colour':ColourID},
            success: function(data) {
                $('select[name="product_size"]').empty();
                $.each(data, function(key, value) {
                    $('select[name="product_size"]').append('<option value="'+ key +'">'+ value +'</option>');
                });
            }
        });


    }else{
        $('select[name="product_size"]').empty();
    }
});
</script>

ajaxpro.php

<?php

   require('config.php');
   $sql= $link->prepare("SELECT * FROM variation WHERE product_id = ? AND product_colour = ? ");
   $sql->bind_param("is", $_GET['mid'], $_GET['product_colour']);
   $sql->execute();
   $result = $sql->get_result();

   $json = [];
   while($row = $result->fetch_assoc()){
        $json[$row['product_size']] = $row['product_size'];
       
   }

   echo json_encode($json);
?>

【问题讨论】：

标签： php jquery ajax

【解决方案1】：

将$_GET['mid'] 放入一个JavaScript 变量中，然后在data: 选项中发送。

var mid = <?php echo json_encode($_GET['mid']); ?>;

$( "select[name='product_colour']" ).change(function () {
    var ColourID = $(this).val();
    if(ColourID) {
        $.ajax({
             url: "ajaxpro.php",
            dataType: 'Json',
            data: {'product_colour':ColourID, mid: mid},
            success: function(data) {
                $('select[name="product_size"]').empty();
                $.each(data, function(key, value) {
                    $('select[name="product_size"]').append('<option value="'+ key +'">'+ value +'</option>');
                });
            }
        });
    }else{
        $('select[name="product_size"]').empty();
    }
});

【讨论】：