按钮点击事件更改dataTable Ajax源

来源:互联网 发布:samsung gear软件下载 编辑:程序博客网 时间:2024/06/07 02:47

       在做查询页面时通常会用dataTable来实现,dataTable默认在表头正上方会显示输入框,该输入框与表头相对应,输入信息可实现动态查询,表头的右上方是搜索输入框,输入信息可实现所有表头相关的动态查询。

       dataTable默认的查询很方便,但是如果查询条件不在定义的表头中,而且希望输入查询条件,点击查询按钮进行查询,这样就需要刷新dataTable的"sAjaxSource"参数,该参数定义了服务器端处理页面,并从该页面返回查询数据。可通过如下设置实现。

1、页面初始化

oTable = $('#pt_table').dataTable({         "bProcessing": true,//当datatable获取数据时候是否显示正在处理提示信息         "bServerSide": true,// 服务器端进行处理         "bPaginate": true, //是否分页         "bLengthChange": true, //是否允许用户自定义每页显示条数         <strong>"sAjaxSource": "finder_ajax.php"</strong>, //查询命令           ......         });
2、实现按钮点击事件

//查询按钮点击事件function onSearch() {    //组合查询条件为json字符串     var json='{"state":"'+document.getElementById("state").value+'"}';    //动态改变Ajax源    oTable.fnSettings().sAjaxSource='finder_ajax.php?jsonstr='+json;    oTable.fnDraw();}


0 0
原创粉丝点击