使用jQuery從JSON/MYSQL更新表格

我很好奇最可接受/有效的方法是如何將表格與json中的數據一起使用。使用jQuery從JSON/MYSQL更新表格

我有一個項目正在開發中，我需要根據mysql表更新表中的單個單元。我的X軸標籤將是各種日期（也從MySQL中拉出）。 Y軸標籤是時間（這些總是相同的，因此可以靜態生成）。該表的內容將是可用的預約插槽（也從MySQL中拉出）。

此表純粹是從mysql讀取的，因此需要更新表。我需要每15秒刷新表格內容（顯然不刷新頁面）。所以我的問題是什麼是給每個單元格提供參考的最佳方式，所以我可以用我的json輸出以編程方式更新它們。如果從預約名冊中刪除一天，這也需要能夠刪除一列。

任何幫助都會令人驚歎。

來源

2012-01-10 Poika

一個簡單的例子會幫助我們談論同樣的事情 – 2012-01-10 10:10:21

這是一個快速模擬，完全沒有我想要實現的樣式。 [鏈接] http://img716.imageshack.us/img716/6706/capturefok.png 頂部的日期可能會相當有規律地改變。這些數字表示可用的約會數量，'X表示不再有約會。這個排序日曆不直接鏈接到實際的個人約會，它純粹是一個計數器。 – Poika 2012-01-11 01:33:03

你只需要顯示細胞的約會數量？ – 2012-01-11 11:28:50

你可以做這樣的

你的表生成：

<?php 
// example for one col 
while($array = mysql_fetchassoc($result)) 
{ 
    ?> 
    <tr> 
     <td id="col_name_<?=$array['row_id']?>"><?=$array['col_val']?></td> 
    </tr> 
    <? 
} 
?>

你的AJAX響應應該是這樣的

<?php 
while($array = mysql_fetchassoc($result)) 
{ 
    ?> 
     $('#col_name_<?=$array['row_id']?>').html('<?=$array['col_val']?>'); 
    <? 
} 
?>

來源

2012-01-10 10:06:03

這不是使用JSON – 2012-01-10 10:46:40

他要求一個解決方案來使用jQuery更新表格單元格。並不是說它必須用JSON來完成。這個想法仍然是一樣的。他可以接收JSON編碼的數據，並在JS中使用我的第二個代碼來更新單元格。 – 2012-01-10 14:03:17

你的意思是你想用JSON一旦用php創建發送表？ – 2012-01-10 14:17:24

我認爲最關鍵的特點是

javascript setTimeout()每隔15秒取數據。看
一種客戶端&服務器數據之間的哈希比較，如果有修改
一個PHP函數，只提取修改申請
Javascript腳本，更新由JSON

發送的約會

也許你應該使用日曆工具進行渲染。
Fullcalendar是一個非常不錯的開源解決方案。

appointment_id, timestamp_start, timestamp_end, ...

於是，您可知道，如果約會已經存在，或者如果它是一個修改（更新或刪除）
你還可以：

對於更新，我會被呈現數據，如接近這個推斷的日期顯示

編輯

因爲你的表是不是大，基於總天/小時，這將是更簡單的管理：

的Javascript setTimeout()每15秒獲取數據，
通過JSON檢索整個表，
加載它通過構建了與jQuery的HTML類似：

table = $('#table_container'); 
/* data -> appointments indexed by hours/days fetched by JSON 
* x -> days, y -> hours 
*/ 
for (y=0; data[y].length; y++) { 
    tr = $('<tr />'); 
    table.append(tr); 
    for (x=0; data[y][x]; x++) { 
    td = $('<td />'); 
    td.html(data[y][x]); 
    tr.append(td); 
    } 
}

沒有測試過，但大概的瞭解

來源

2012-01-10 10:26:20

感謝隊友，該插件實際上看起來很複雜，我想做的事情。我想知道你是否可以詳細闡述哈希比較如何工作。或者，如果你能指出我在線資源的正確方向。 – Poika 2012-01-11 00:55:56

使用jQuery從JSON/MYSQL更新表格

回答

相關問題