这篇文章给大家介绍java项目中使用datatables如何实现一个带条件查询功能,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。使用datatables自带后台查询 前台代码:<!DOCTYPE html>
这篇文章给大家介绍java项目中使用datatables如何实现一个带条件查询功能,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。
使用datatables自带后台查询
前台代码:
<!DOCTYPE html><html><head><meta charset="utf-8"><link rel="shortcut icon" type="image/ico" href="Http://www.datatables.net/favicon.ico" rel="external nofollow" ><meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0"><link rel="stylesheet" type="text/CSS" href="../../js/DataTables-1.10.8/media/css/Jquery.dataTables.css" rel="external nofollow" ><script type="text/javascript" language="javascript" src="../../js/DataTables-1.10.8/media/js/jquery.js"></script><script type="text/javascript" language="javascript" src="../../js/DataTables-1.10.8/media/js/jquery.dataTables.js"></script><script type="text/javascript" language="javascript" class="init"> var table;$(document).ready(function() { table = $('#example').DataTable( { "pagingType": "simple_numbers",//设置分页控件的模式 searching: false,//屏蔽datatales的查询框 aLengthMenu:[10],//设置一页展示10条记录 "bLengthChange": false,//屏蔽tables的一页展示多少条记录的下拉列表 "oLanguage": { //对表格国际化 "sLengthMenu": "每页显示 _MENU_条", "sZeroRecords": "没有找到符合条件的数据", // "sProcessing": "<img src='./loading.gif' />", "sInfo": "当前第 _START_ - _END_ 条 共计 _TOTAL_ 条", "sInfoEmpty": "木有记录", "sInfoFiltered": "(从 _MAX_ 条记录中过滤)", "sSearch": "搜索:", "oPaginate": { "sFirst": "首页", "sPrevious": "前一页", "sNext": "后一页", "sLast": "尾页" } }, "processing": true, //打开数据加载时的等待效果 "serverSide": true,//打开后台分页 "ajax": { "url": "../../alarms/datatablesTest", "dataSrc": "aaData", "data": function ( d ) { var level1 = $('#level1').val(); //添加额外的参数传给服务器 d.extra_search = level1; } }, "columns": [ { "data": "total" }, { "data": "level" } ] } );} );function search2(){ table.ajax.reload();} </script></head><body class="dt-example"> <div> <input type="text" id="level1"> <input type="button" onclick="search2()" value="查询"> </div> <table id="example" class="display" cellspacing="0" width="100%"> <thead> <tr> <th>Name</th> <th>Position</th> </tr> </thead> </table></body></html>
--结束END--
本文标题: java项目中使用datatables如何实现一个带条件查询功能
本文链接: https://www.lsjlt.com/news/225809.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0