DataTables添加額外的查詢參數(shù)和刪除columns等無(wú)用參數(shù)實(shí)例
廢話不多說(shuō),直接上代碼
//1.定義全局變量
var iStart = 0, searchParams={};
//2.配置datatable的ajax配置項(xiàng)
"ajax": {
"url": "/user/query",
"type": "POST",
//動(dòng)態(tài)請(qǐng)求參數(shù)設(shè)置,會(huì)應(yīng)用到每次請(qǐng)求
"data": function (d) {
//刪除多余請(qǐng)求參數(shù)
for(var key in d){
if(key.indexOf("columns")==0||key.indexOf("order")==0||key.indexOf("search")==0){ //以columns開頭的參數(shù)刪除
delete d[key];
}
}
//附加查詢參數(shù)
if(searchParams){
$.extend(d,searchParams); //給d擴(kuò)展參數(shù)
}
},
//數(shù)據(jù)源處理(當(dāng)數(shù)據(jù)加載完畢時(shí)觸發(fā))
"dataSrc": function ( json ) {
iStart = json.start + 1; //起始行號(hào)
return json.data;
}
}
//3.查詢按鈕綁定點(diǎn)擊事件
/**
* 搜索
*/
$('.search').click(function () {
reloadTable();
});
//4.刷新表格方法
/**
* 重新加載表格,刷新頁(yè)碼
*/
function reloadTable() {
//希望搜索一次附加參數(shù),修改搜索條件后,如果不點(diǎn)擊搜索按鈕,切換頁(yè)碼仍使用上次參數(shù)
var number = $("#number").val();
var name = $("#name").val();
searchParams.number = number;
searchParams.name = name;
var table = $('#userTable').DataTable();
table.ajax.reload();
}
//5.刷新表格,頁(yè)碼不變方法
/**
* 刷新表格,不改變頁(yè)碼
*/
function refreshTable() {
var table = $('#userTable').DataTable();
table.draw(false);
}
//6.跳頁(yè)實(shí)現(xiàn)
$('#example').DataTable().page(5).draw(false)
或者
$('#example').DataTable().page(5).draw('page')
以上這篇DataTables添加額外的查詢參數(shù)和刪除columns等無(wú)用參數(shù)實(shí)例就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
bootstrap-table.js擴(kuò)展分頁(yè)工具欄(增加跳轉(zhuǎn)到xx頁(yè))功能
這篇文章主要介紹了bootstrap-table.js擴(kuò)展分頁(yè)工具欄,增加跳轉(zhuǎn)到xx頁(yè)功能,由于小編的水平停留在dom級(jí),此次擴(kuò)展只支持頁(yè)面上的表格,如果大家有好的建議歡迎提出2017-12-12
eCharts圖表實(shí)現(xiàn)扇形和折線圖代碼示例
本文概述了前端和后端實(shí)現(xiàn)數(shù)據(jù)可視化圖表的步驟,前端部分涉及引入文件、設(shè)置盒子、發(fā)送請(qǐng)求等,最終通過(guò)ECharts初始化圖形,后端則包括定義VO類、處理mapper和業(yè)務(wù)邏輯等,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-09-09
使用JS實(shí)現(xiàn)在空白頁(yè)上展示出一個(gè)有趣的時(shí)鐘
在我們?nèi)粘5木W(wǎng)頁(yè)瀏覽中,空白的頁(yè)面往往會(huì)被視為一種無(wú)趣的事物,一片等待填充的空間,今天我們來(lái)學(xué)習(xí)一下如何使用JS在空白的網(wǎng)頁(yè)上展示出一個(gè)有趣的時(shí)鐘吧,感興趣的小伙伴跟著小編一起來(lái)看看吧2024-04-04
Java 正則表達(dá)式學(xué)習(xí)總結(jié)和一些小例子
字符串處理是許多程序中非常重要的一部分,它們可以用于文本顯示,數(shù)據(jù)表示,查找鍵和很多目的.在Unix下,用戶可以使用正則表達(dá)式的強(qiáng)健功能實(shí)現(xiàn)這些 目的2012-09-09
純JavaScript 實(shí)現(xiàn)flappy bird小游戲?qū)嵗a
這篇文章主要介紹了純JavaScript 實(shí)現(xiàn)flappy bird小游戲?qū)嵗a,b本文分七大步驟給大家介紹,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-09
使用JavaScript實(shí)現(xiàn)小球按照貝塞爾曲線運(yùn)動(dòng)
要在 JavaScript 中實(shí)現(xiàn)一個(gè)按照貝塞爾曲線運(yùn)動(dòng)的小球,關(guān)鍵是要掌握貝塞爾公式的基本原理和實(shí)現(xiàn)方式,以及使用 JavaScript 處理動(dòng)畫和物理運(yùn)算,感興趣的小伙伴跟著小編一起來(lái)看看吧2024-10-10
JavaScript面向?qū)ο髮?shí)現(xiàn)貪吃蛇游戲
這篇文章主要為大家詳細(xì)介紹了JavaScript面向?qū)ο髮?shí)現(xiàn)貪吃蛇游戲,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04

