Ajax将对象数组返回给jquery和php

I am not exactly sure if I'm doing it correctly but I will appreciate if someone can explain to me the process

我不确定我是否正确地做了，但如果有人能向我解释这个过程，我将不胜感激

I have a div in my main.php file with onclick function

我的main.php文件中有一个带有onclick函数的div

<div class='show_products' onclick='getData(".$id.")'>

The jquery function:

jquery函数：

function getData(id){    
$.ajax({
    url: 'ajax_info.php',
    type: 'POST',
    dataType:'json',
    data: {id: id},
    success: function(response) {
        console.log(response); //shows a list of objects (array elements)
    }
});
}

And the ajax file

和ajax文件

$sql = "SELECT ......";
$results = Db::getInstance()->ExecuteS($sql);
foreach($results as $row) {
    $product_id = $row['product_id'];
    $date = $row['date'];
    $name = $row['name'];

    $array_info['product_id'] = $product_id;
    $array_info['date'] = $date;
    $array_info['name'] = $name;
}

echo json_encode($array_info);

The above code returns the array created in ajax file, back to jquery within the success function.

上面的代码返回在ajax文件中创建的数组，返回到success函数中的jquery。

What I don't understand is: How can I go through the array and use it in the main.php file? I want to iterate through it and create a table with the values in the array. Meaning 3 columns, product id - date - name, and they will be populated by the returned array from ajax.

我不明白的是：我如何通过数组并在main.php文件中使用它？我想迭代它并创建一个包含数组中值的表。含义3列，产品ID - 日期 - 名称，它们将由来自ajax的返回数组填充。

Is that possible or am I doing it wrong?

这可能还是我做错了？

Would appreciate any help

非常感谢任何帮助

EDIT: Updated jquery code

编辑：更新了jquery代码

function getData(id){    
$.ajax({
    url: 'ajax_info.php',
    type: 'POST',
    dataType:'json',
    data: {id: id},
    success: function(response) {
        document.getElementById('table_'+id).style.display='block';

        for ( var i = 0; i < response.length; i++ ) {
            console.log(response[i]);                
            var div = document.getElementById('table_'+id);
            div.innerHTML = div.innerHTML + '<tr><td>'+response[i].product_id+'</td><td></td><td></td><td></td><td></td></tr>';
        }
    }
});
}

4 个解决方案

#1

Well each loop of your foreach will erase the data defined in the preview loop, so when your foreach is done iterating you end up with the last set of data.

好吧，foreach的每个循环都会擦除预览循环中定义的数据，所以当你的foreach完成迭代时，你最终会得到最后一组数据。

You don't need to iterate through the array, because your query already returns an array

您不需要遍历数组，因为您的查询已经返回一个数组

$sql = "SELECT ......";
$results = Db::getInstance()->ExecuteS($sql);
echo json_encode($results);

Now if you want to access you data from the success function you just need call them the same name as your rows. for instance if you rows are product_id, date, and name you will call them that way:

现在，如果您想从成功函数访问数据，您只需要将它们称为与行相同的名称。例如，如果您的行是product_id，date和name，您将以这种方式调用它们：

function getData(id){    
$.ajax({
    url: 'ajax_info.php',
    type: 'POST',
    dataType:'json',
    data: {id: id},
    success: function(response) {
        response = JSON.parse(response);

        console.log("Product id is: " + response[0].product_id);
        console.log("Product name is: " + response[0].name);
        console.log("Product date: " + response[0].date);
    }
});
}

You also need to understand the following: say for some reason you want to have different variable name for your json without changing your database then you will have to do the following:

您还需要了解以下内容：出于某种原因，您希望在不更改数据库的情况下为json设置不同的变量名称，然后您必须执行以下操作：

$sql = "SELECT ......";
$results = Db::getInstance()->ExecuteS($sql);
$newResults = array();

foreach ($results as $row)
{
    $newResults[] = array('newId' => $row['product_id'], 'newName' => $row['name'], 'newDate' => $row['date']);
}

echo json_encode($newResults);

Which will result of changing the variables in JSON:

这将导致更改JSON中的变量：

function getData(id){    
$.ajax({
    url: 'ajax_info.php',
    type: 'POST',
    dataType:'json',
    data: {id: id},
    success: function(response) {
        response = JSON.parse(response);

        console.log("Product id is: " + response[0].newId);
        console.log("Product name is: " + response[0].newName);
        console.log("Product date: " + response[0].newDate);
    }
});
}

#2

the first step you have to do is parse the response into json, then you have to create table tag with the id.

您需要做的第一步是将响应解析为json，然后您必须使用id创建表标记。

example here's your JS

这里的例子是你的JS

function getData(id){    
$.ajax({
    url: 'ajax_info.php',
type: 'POST',
dataType:'json',
data: {id: id},
success: function(response) {
    var data = JSON.parse(response);
    var st = "";
    $.each(data, function(index){
       st += "<tr><td>"+data[index].product_id+"</td>";
       st += "<td>"+data[index].date+"</td>";
       st += "<td>"+data[index].name+"</td></tr>";
    });
    $("#table_id").html(st);
}
});
}

then here's html

那么这是HTML

<table border="1" id="table_id">
</table>

#3

The problem here is that javascript does not allow associative arrays, so you would have to use regular numeric arrays, or an object.

这里的问题是javascript不允许关联数组，因此您必须使用常规数值数组或对象。

Here is an example of using numeric arrays:

以下是使用数值数组的示例：

$sql = "SELECT ......";
$results = Db::getInstance()->ExecuteS($sql);
foreach($results as $row) {
    $product_id = $row['product_id'];
    $date = $row['date'];
    $name = $row['name'];

    $array_info[0] = $product_id;
    $array_info[1] = $date;
    $array_info[2] = $name;
}

echo json_encode($array_info);

And then you can get the output like this:

然后你可以得到这样的输出：

function getData(id){    
$.ajax({
    url: 'ajax_info.php',
    type: 'POST',
    dataType:'json',
    data: {id: id},
    success: function(response) {

      var product_id = response[0];
      var date = response[1];
      var name = response[2];

    });
    }

#4

You can use JSON.parse() function on response to make it usable by JavaScript.

您可以在响应中使用JSON.parse（）函数以使其可由JavaScript使用。

#1