如何顯示JSON數組從查詢

Question

重複區域目前，所有與我的jQuery .post的$行動，成功連接，查詢和json_encode迴歸到我的網頁的工作。我無法做的（而且是json的新功能）是如何將返回的值顯示爲實時Feed？我目前的jQuery的js文件是「jQuery的1.7.2.min.js」和我的代碼是

$(document).ready(function(){ 
     setInterval(function(){ 
     $.post('query.php', function(pendingReq){ 
     $('#div_id').html(pendingReq); 
     }), 'json' }); 
    }, 5000 

); 

pendingReq就像是從查詢和電流輸出我返回的數據如下：根據我的MySQL查詢 {"[0]":"FirstReq", "[1]":"SecondReq", ...."}建立數組

$res = array("[0]"=>var['1']...); 

的我是很新的使用JSON和不使用大量的JavaScript，但希望能有返回的數據在表中顯示出來，謝謝。下面

我的代碼工作，但對於MySQL查詢的只有一行，如果兩個條目存在，我得到一個「未捕獲的SyntaxError：意外的標記{」在Firebug的錯誤？儘管如此返回結果爲前：

$res = array("req_name"=>$ew_display['req_name'], "date"=>$ew_display['req_dt']); 
echo json_encode($res); 



$(document).ready(function(){ 
      var table_template = "<table border=1 cellspacing=0 id='results'><tr><th>JTAR #</th><th>JTAR @</th></tr></table>"; 
      $("#testd").html(table_template); 
    setInterval(function(){ 
     $.post("query.php", {track : 2}, function(pendingReq){ 
      var json = JSON.parse(pendingReq); 
      var template = "<tr><td>{{req_name}}</td><td>{{date}}</td></tr>"; 
      var new_row = Mustache.render(template, json); 
      $("#results").append(new_row).fadeIn("slow"); 
     }), "json" 
}, 5000); 

Answer 1

- 編輯 -

既然你已經在那裏有一個時間間隔，模板可以是不變的：

var table_template = "<table border=1 cellspacing=0 id='results_table'><tr><th>col1</th><th>col2</th></tr></table>"; 
$("#div_id").html(table_template); 
var template = "<tr><td>{{[0]}}</td><td>{{[1]}}</td></tr>"; 

現在的時間間隔，您可以分析結果字符串並呈現每個行：

setInterval(function() { 
    $.post("query.php", function(pendingReq) { 
     var json = JSON.parse(pendingReq); 
     var new_row = Mustache.render(template, json); 
     $("#results_table").append(new_row); 
    }); 
}); 

- 編輯完 -

我Mustache.js的大風扇（HTTPS ：//github.com/janl/mustache.js），它允許您從演示文稿（HTML表格）中分離數據（JSON）。我不喜歡從預格式化爲HTML的服務器返回AJAX數據。你可以使用這樣的語法（僅用於示例）：

var template = "<table>{{#item}}<tr><td>{{name}}</td><td>{{age}}</td><td>{{job}}</td></tr>{{/item}}</table>"; 
var html = Mustache.render(template, pendingReq); 
$('#div_id').html(html); 

Answer 2

乍得，請使用json_encode（）爲您的數組 「$ RES」

echo json_encode($res); 

如果PHP返回一個字符串，那麼你可以使用

var json = JSON.parse(pendingReq); 

一旦你得到json對象，你可以使用。操作員訪問屬性。

首先找出你的JSON包含... 做：

alert(JSON.stringify(json)); 

轉換字符串化JSON對象以可讀的字符串 你可以轉換回使用JSON.parse; 您可以訪問做json.property屬性。

現在你可以擁有不斷更新的所有數據表。 考慮的對象是這樣的： VAR OBJ = {名稱： 「亞當」，年齡：35，職業： 「程序員」}; 您可以通過此信息添加到表：

$("#table").html($("#table").html() + "<tr><td>" + obj.name + "</td><td>" + obj.age + "</td><td>" + obj.job + "</td></tr>"); 

Answer 3

jQuery的文檔說明了如何使用其返回，Ajax回調函數內部JSON：http://api.jquery.com/jQuery.getJSON/

但不是返回查詢結果JSON，你爲什麼不返回HTML（包含你的結果表的代碼），然後直接顯示一個div內部的HTML？

這裏做這樣的事情的一個例子： Modifying the AJAX PHP database example

UPDATE：如何返回數據作爲HTML而不是JSON：

OK，讓我們假設你的PHP腳本目前返回一個JSON編碼字符串：

$str_json = '{"0":"FirstReq", "1":"SecondReq", ...."}'; 

現在做這樣的事情在PHP腳本 - 這取決於你想顯示當然什麼：

$lst_data = json_decode($str_json); 

$html = "<table>\n<tr>\n"; 
foreach ($lst_data as $i => $data) { 
    $html .= "<th>" . $i . "</th>"; 
$html .= "</tr>\n<tr>\n"; 
foreach ($lst_data as $data) { 
    $html .= "<td>" . $data . "</td>"; 
} 
$html .= "</tr>\n</table>\n"; 

echo $html; 

編輯：你可能有類似這樣的東西：

$res = mysql_fetch_assoc($data); 

// Remove this from your script: echo json_encode($res); 

// Add this: 
$html = "<table>\n<tr>\n"; 
foreach ($res as $i => $r) { 
    $html .= "<th>" . $i . "</th>"; 
$html .= "</tr>\n<tr>\n"; 
foreach ($res as $r) { 
    $html .= "<td>" . $r . "</td>"; 
} 
$html .= "</tr>\n</table>\n"; 

echo $html; 

...並記得設置的dataType jQuery的$。員額（）函數來html。