我在更新一個大集合其它各個DataTable的Data時,因為人手Copy&Paste,經常忙記有沒有做到,渡至錯漏而找不到資料。所以,就想抽起<td>...</td> 部份分柝到另一檔案這概念,各個DataTable的Data都有一個data檔案,而那個大集合的DataTable會加入各個小DataTable的Data而型成,但我不知到什麼方法才可以合併?而我並沒有使用Php+Database,只想用JS+CSS+HTML做到,可以幫幫忙嗎?有沒有完整的案例可下載或睇到呢?
跑ajax抓json來做table
javascript的ajax的部份,偷懶所以用jQuery
function calllNeverConfirmed() {
$.post({
url: 'admin.php',
dataType: "json",
data: {
action: "GetNeverConfirmedData"
}
})
.done(function(d) {
let vtable = $("<table class='rtable'></table>");
if (d.length > 0) {
let trh = $("<tr></tr>");
//建th
Object.entries(d[0]).forEach(entry => {
const [key, value] = entry;
if (!key.startsWith('-')) {
// 如果欄位名字前面有-就不處理
// 帶 - 的欄位是有特殊用意
trh.append($(`<th>${key}</th>`));
}
})
vtable.append(trh);
d.forEach(function(i, v) {
let tr = $("<tr></tr>");
Object.entries(i).forEach(entry => {
const [key, value] = entry;
let tvalue = value;
if (!key.startsWith('-')) {
if (value.indexOf("detail://") >= 0) {
// 如果內容是detail://開頭,則用按鍵
tvalue = $(`<button class="buttonDetail">展開</button>`);
// 在這個button裡塞資料
tvalue.data(i);
let td = $("<td></td>");
td.append(tvalue);
tr.append(td);
} else {
let td = $("<td></td>");
td.text(tvalue);
tr.append(td);
}
}
})
vtable.append(tr);
});
}
$("#reportNeverConfirmedData").append(vtable); //塞回頁面
});
}
php的部份,用pdo抓資料庫,方法略述
function getNeverConfirmedData()
{
global $pdo;
$statement = $pdo->prepare(
"SELECT
`id` as `流水號`
,`applydate` as `申請時間`
,`ALIVER_NAME` AS `申請人`
,`ALIVER_TEL` AS `連絡電話`
,CASE `PAYMENTMETHOD` WHEN 0 THEN '預付' WHEN 1 THEN '現金袋' WHEN 2 THEN concat('匯款',`memo`) END `付款方式`
,`SUM` AS `金額`
,concat('detail://',`uid`) AS `明細`
FROM `nbs_worship`.`applyments` as `m`
WHERE `m`.`CONFIRMED` = 0 ;"
);
$statement->execute();
//直接就把這個dataset做成json丟回前端,就上上述的javascript裡的方法
return json_encode($statement->fetchAll(PDO::FETCH_ASSOC));
}
有沒有完整案例檔可下載來看看?
看你要的是什麼樣的範例
1、後端把資料庫的查詢結果直接丟JSON出來,前端javascript再把JSON轉成TABLE輸出在頁面上
2、後端把前端要找的東西上網爬,爬到的結果用JSON傳回前端javascript再跟上一例一樣轉成HTML用TABLE或bootstrap DIV ROW/CELL輸出
看你慣用的是什麼後端平台,前端用不用js框架
好感謝您的提意,但我的情況也像您所說,已將data分柝出來,一個HTML檔用JS去load JSON檔。但想做一個整合版本,將所有的JSON檔合併在一個datatables顯示。就是遇到這問題,不知怎樣才能合併多個在一起?謝謝?
重點是,這多個來源的json是否有相同的dictionary型式
如
{
"a":"1",
"b":"11",
"c":"111",
"d":"............"
}
可以給我製作一個簡單的例子,讓我下載後慢慢研究嗎?
你慣用語言跟SQL平台是?
我現時都是初學者,但基本HTML,CSS都算可以JS比較弱,而php則是從新學習。通常用NAS作為測試平台,而NAS可以行MySQL 及 MariaDB。而最近更新個人網站,已改用HTML+CSS+JS,原因是怕將來少玩編程而忙記,因為我興趣不止在寫網頁,也有別的DIY。而且想在落後國家教小朋友使用電腦時,要顧及頻寬而刻意不用/少用server side service。話晒外地網絡很差,可能只玩到內聯網。若果能不需使用SQL就更好,之前參考了很多別人講 dataTables的load from json/ajax,但自己真的一知半解,最後成功了,但只限於一對一。一個HTML之dataTables load入一個檔,但想加入兩個或以上時,便不知怎樣才能做到!