簡體   English   中英

以表格格式顯示JSON結果

[英]Display JSON result in Table Format

 $.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 Inspect元素來查看響應。 請幫我以HTML表格格式顯示檢索到的結果。

如果在succes響應中添加console.log(data),則可以看到對象的結構。

要訪問所需的json值,您應該嘗試數據['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

您有語法錯誤:使用

txt += <tr><td>

代替

txt += tr><td>

如果條件

用這個

$.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]

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM