以表格格式显示JSON结果

Question

 $.ajax({
     type: 'GET',
     url: 'die_issue_result.php',
     data: {
         vals: die_no
     },
     dataType: "json", //to parse string into JSON object,
     success: function (data) {
         if (data) {
             var len = data.length;
             var txt = "";
             if (len > 0) {
                 for (var i = 0; i < len; i++) {
                     if (data[i].die_no && data[i].status && data[i].location) {
txt += "<tr><td>"+data[i].die_no+"</td><td>"+data[i].status+"</td><td>"+data[i].location+"</td></tr>";
                     }
                 }
                 if (txt != "") {
                     $("#table").append(txt).removeClass("hidden");
                 }
             }
         }
     }

控制器页面

$die_no = array();
$status = array();
$location = array();
while ($row = mysql_fetch_array($query)) {
    $die_no[] = $row["die_no"]; // or smth like $row["video_title"] for title
    $status[] = $row["status"];
    $location[] = $row["location"];

}
$res = array($die_no, $status, $location);
echo json_encode($res);

HTML页面

<p>
    <table id="table" class="hidden">
        <tr>
            <th>die_no</th>
            <th>Status</th>
            <th>Location</th>
        </tr>

我希望以HTML表格的形式显示结果，所以我将结果以数组格式传递给Json，但结果未在HTML页面中显示。我可以使用Chrome的检查元素功能在网络选项下看到响应。请帮助我以HTML表格格式显示检索到的结果。

- user1894647

---

你刚刚自己纠正了Ali Mehdi和我指出的错误。你的代码现在工作了吗？ - Daniel

@Daniel 抱歉，它不起作用。 - user1894647

@user1894647，请检查我的回答，请告诉我是否有帮助，否则告诉我你的console.log（data）输出内容。 - Petru Lebada

Answer 1

如果您在成功响应中添加console.log(data)，您可以看到对象的结构。 要访问所需的JSON值，您应该尝试data ['die_no'] [i]，data ['status'] [i]，data ['location'] [i]。 您可以像这样插入响应：

<table id="tbl">
</table>

JavaScript：

 $.ajax({
 type: 'GET',
 url: 'die_issue_result.php',
 data: {
     vals: die_no
 },
 dataType: "json", //to parse string into JSON object,
success: function (data) {
         if (data) {
         var len = data.length;
             if (len > 0) {
                 for (var i = 0; i < len; i++) {                         
                  $('$tbl').append("<tr><td>"+data['die_no'][i]+"</td><td>"+data['status'][i]+"</td><td>"+data['location'][i]+"</td></tr>");                         
                 }                     
             }
         }
}
}); //you missed this in your question

- Petru Lebada

Answer 2

你有语法错误： 使用

txt += <tr><td>

替代

txt += tr><td>

在 if 条件之后

- Ali Mehdi

---

我有正确的代码，但在发布时不小心删除了“<”，但仍然无法正常工作。 - user1894647

请检查我的另一个答案。 - Ali Mehdi

Answer 3

使用这个

$.ajax({
            type: 'GET',
            url: 'die_issue_result.php',
            data: {
                vals: die_no
            },
            dataType: "json", //to parse string into JSON object,
            success: function (data) {

                if (data) {
                    var len = data.length;
                    var txt = "";
                    if (len > 0) {
                        for (var i = 0; i < len; i++) {
                            if (data[0][i] || data[1][i] || data[2][i]) {
                                txt += "<tr><td>" + data[0][i] + "</td><td>" + data[1][i]  + "</td><td>" + data[2][i]  + "</td></tr>";
                            }
                        }
                        if (txt != "") {
                            $("#table").append(txt).removeClass("hidden");
                        }
                    }
                }
            }
        });

实际上，您的php代码没有返回键值对。因此，在您的js中，您无法使用data.die_no等。 就像我所做的那样使用它:

data[0][i]

- Ali Mehdi

---

它可以工作，但是你的代码只显示了3条记录，而我的实际查询在mysql phymyadmin中返回了10条记录。请帮我显示所有10条记录。 - user1894647

你需要编辑你的PHP代码以添加键值对... 你可以使用二维数组，像 $status[]['status'] = $row["status"]; - Ali Mehdi

如果我添加 $status[]['status'] = $row["status"]; 它会在输出中返回 object object，并且仅返回 3 行。 - user1894647

更新你的 PHP 代码，这样我就可以为你编写 JS。 - Ali Mehdi