如何使用AJAX将数组值传递给PHP？

I am trying to submit data to the database using AJAX. I have one array and I have to pass the value of the array to PHP using AJAX to display all the related records.

我正在尝试使用AJAX将数据提交到数据库。我有一个数组，我必须使用AJAX将数组的值传递给PHP以显示所有相关记录。

<form id="search-form" method="POST">
  <input value="4869" name="compare_id[]" type="hidden">
  <input value="4884" name="compare_id[]" type="hidden">
  <input value="5010" name="compare_id[]" type="hidden">
  <input type="button" id="search-button" name="search-button" value="search">
</form>
<div id="response"></div>

AJAX

AJAX

<script>
    $(document).ready(function(){
        $('#search-button').click(function(){
            $.ajax( {
                type: 'POST',
                url: 'response.php',
                data: $('#search-form').serialize(),
                dataType: 'json',
                success: function(response) {
                    $('#response').html(response);
                    //alert(response);
                }
            });
        });
    });
</script>

PHP

PHP

$sql='SELECT Name, Email FROM request WHERE Id IN (' .( is_array( $_POST['compare_id'] ) ? implode( ',', $_POST['compare_id']) : $_POST['compare_id'] ).')';

    $records = array();
    $query=$conn->query($sql);

    if ($query->num_rows > 0) {
    while($row=$query->fetch_assoc()){ 
        $records[]=$row;
    }
}
echo json_encode($records);exit();

3 个解决方案

#1

change your script as below. Your output is in array so you cant add it in div directly

更改您的脚本如下。您的输出是在数组中，所以你不能直接在div中添加它

<script>
    $(document).ready(function(){
        $('#search-button').click(function(){
            $.ajax( {
                type: 'POST',
                url: 'action.php',
                data: $('#search-form').serialize(),
                dataType: 'json',
                success: function(response) {
                     $('#response').html();
                    for(data in response) //loop over your data
                    {
                      $('#response').append(response[data].Email);  //add email
                    }

                    //alert(response);
                }
            });
        });
    });
</script>

#2

HTML

HTML

<form id="search-form" method="POST">
  <input value="4869" name="compare_id[]" type="hidden">
  <input value="4884" name="compare_id[]" type="hidden">
  <input value="5010" name="compare_id[]" type="hidden">
  <input type="button" id="search-button" name="search-button" value="search">
</form>
<div id="response"></div>

JS

JS

<script>
    $(document).ready(function(){
        $('#search-button').click(function(){
            $.ajax( {
                type: 'POST',
                url: 'response.php',
                data: $('#search-form').serialize(),
                dataType: 'json',
                success: function(response) {
                    $('#response').html(response);
                }
            });
        });
    });
</script>

PHP

PHP

var_dump($_POST['compare_id']);
// it is already an array of ids. You can do whatever you want with it.

#3

There are errors in your code. A good way to debug this is to print_r your POST value in your php script.

您的代码中存在错误。调试它的一个好方法是在php脚本中print_r你的POST值。

First $_POST["All"] does not exist. It is all. (php)

首先$ _POST [“全部”]不存在。这就是全部。 （PHP）

Second, you send a GET request not a POST one. (jQuery)

其次，您发送GET请求而不是POST请求。 （jQuery的）

Third, format your date into json. A good way to do this is to create a variable right after compare_id.push, it's more readable, as so :

第三，将你的日期格式化为json。一个很好的方法是在compare_id.push之后创建一个变量，它更具可读性，因为：

var json_data = {"my_array" : [1,2, "bonjour", 4]};

Your problem is mostly related to "how to debug". I think you should print what's happening along the way to figure out what's happening.

您的问题主要与“如何调试”有关。我认为你应该打印出正在发生的事情，以弄清楚发生了什么。