如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里
Bootstrap Table實現(xiàn)定時刷新數(shù)據(jù)
推薦第二種方法
1、毀掉表格,再查詢數(shù)據(jù)后append,如果你查大量的數(shù)據(jù)(例如:查詢很多渠道的信息),而獲取服務器數(shù)據(jù)又太慢,你就會看到表格在一行一行的增加
-
定時器,多長時間執(zhí)行一次,自己定義,此處是30S
setInterval(function() { queryAll();
}, 30000);
-
先定義一個函數(shù),里面放入查詢的方法updateRealTimeData和你所自定義使用的方法
function queryAll() { updateRealTimeData();
.
.
.
.
}
function updateRealTimeData() { if(errorFlag || appid == -1) return; $("#realTimeTable").bootstrapTable('removeAll'); $.ajax({
data: { .
.
.
.
.
},
type: "post", url: *******,
async: true, timeout:30000,
success: function(msg) { if(msg.code == '1') { showTableData(msg,……);
}
}
});
}
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
-
27
-
28
-
29
-
30
function showTableData(msg,……) { tableData = []; for(var i = 0; i < json.length; i++) {
tableData.push({ date: json[i].getDate,
.
.
.
.
}) tableData.reverse(); $("#realTimeTable").bootstrapTable('append', tableData);
}
}
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
2、使用updateRow方法
-
首先,得存在表格,里面有數(shù)據(jù),才能更新行,否則沒作用。此方法不會像上面的方法表格消失再增加,這個是整體不變,里面的數(shù)據(jù)會自動更新
-
定時器,和上面一樣,多長時間執(zhí)行一次,自己定義,此處是30S
setInterval(function() { queryAll(); for (var j = 0; j < 請求的數(shù)據(jù)的總條數(shù)(也就等于表格的行數(shù)); j++) {
changeAllChannelRealTime(j, .....);
} }, 30000);
function changeAllChannelRealTime(j, .....) {
$.ajax({
data: { .
.
.
.
.
},
type: "post", url: *******,
async: true, timeout:30000,
success: function(msg) { if (msg.code == '1') {
changeData(j, msg, .....);
}
},
error: function () { msgToast.error("查詢數(shù)據(jù)出錯");
}
});
}
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
-
15
-
16
-
17
-
18
-
19
-
20
-
21
-
22
-
23
-
24
-
25
-
26
function changeData(i,msg,......){ $('#realTime_Table').bootstrapTable('updateRow', { index: i,
row: { date: msg.*
.
.
.
.
}
});
}
-
1
-
2
-
3
-
4
-
5
-
6
-
7
-
8
-
9
-
10
-
11
-
12
-
13
-
14
大象~ 大象~ 你的鼻子怎么那么長~~
其他相關:
藍藍設計( www.wnxcall.com )是一家專注而深入的界面設計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務。