> 웹 프론트엔드 > JS 튜토리얼 > DataTable 추가 및 삭제와 같은 작업의 예

DataTable 추가 및 삭제와 같은 작업의 예

零下一度
풀어 주다: 2018-05-18 11:06:55
원래의
1828명이 탐색했습니다.

아래 편집기는 추가 쿼리 매개변수를 추가하고 DataTables의 열과 같은 쓸모 없는 매개변수를 삭제하는 예를 제공합니다.

//1.定义全局变量
var iStart = 0, searchParams={};
//2.配置datatable的ajax配置项
"ajax": {           
"url": "/user/query",           
"type": "POST",           
//动态请求参数设置,会应用到每次请求   
"data": function (d) {               
//删除多余请求参数   
for(var key in d){                   
if(key.indexOf("columns")==0||key.indexOf("order")==0||key.indexOf("search")==0){ //以columns开头的参数删除   
delete d[key];
                   }
               }               
               //附加查询参数   
               if(searchParams){
                   $.extend(d,searchParams); //给d扩展参数               
                   }
           },           
           //数据源处理(当数据加载完毕时触发)   
           "dataSrc": function ( json ) {
               iStart = json.start + 1; //起始行号   
               return json.data;
           }
       }
       //3.查询按钮绑定点击事件
       /**
        * 搜索     
        */
        $('.search').click(function () {
        reloadTable();
    });
    //4.刷新表格方法
    /**
     * 重新加载表格,刷新页码 
     */
     function reloadTable() {//希望搜索一次附加参数,修改搜索条件后,如果不点击搜索按钮,切换页码仍使用上次参数
     var number = $("#number").val();
     var name = $("#name").val();
    searchParams.number = number;
    searchParams.name = name;
    var table = $('#userTable').DataTable();
    table.ajax.reload();
}
//5.刷新表格,页码不变方法
/**
 * 刷新表格,不改变页码 
 */
 function  refreshTable() {
 var table = $('#userTable').DataTable();
    table.draw(false);
}
//6.跳页实现
$('#example').DataTable().page(5).draw(false)
或者
$('#example').DataTable().page(5).draw('page')
로그인 후 복사


위 내용은 DataTable 추가 및 삭제와 같은 작업의 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿