bootstrap-table的queryParams使用
queryParams是bootstrap-table的一个属性功能，主要是用来做多条件查询的。
然后param这个方法在jq里面也有（。。。是因为我百度太多了）。说是序列实例化，其实我不是很明白，官方解释说这是序列化一个键值对。
但是bootstrap-table里面这个用起来没有想象中复杂。
首先是前端代码写了：data-query-params="queryParams"
使用的话，我是配合了button来使用的：
<input type="text" id="test" placeholder="输入用户id" >
<input type="text" id="test1" placeholder="输入用户名" >
<input type="button" value="找它" id="name">
最后是点击之后的执行。并不需要写太多代码，只要获得输入框里面的值，然后点按钮就可以了。
这里面的params.search1是我自定义的，你也可以定义成params.aa之类的，但是最好不要自定义为params.search，因为会和它默认的一个search搜索框冲突。
<script>
function queryParams(params) {
var uid = $("#test").val();
var name = $("#test1").val();
params.search1 = uid;
params.search2 = name;
return params;
}
$('#name').click(function () {
$('#table').bootstrapTable('refresh')
})
</script>
完整的前端代码：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>第二个</title> 6 <script src="https://cdn.bootcss.com/jquery/3.5.1/jquery.min.js"></script> 7 <script type="text/javascript" src="<?php echo base_url('style/js/bootstrap.js');?>"></script> 8 <link rel="stylesheet" type="text/css" href="<?php echo base_url('style/css/bootstrap-table.min.css');?>"> 9 <link rel="stylesheet" type="text/css" href="<?php echo base_url('style/css/bootstrap.css');?>"> 10 <script type="text/javascript" src="<?php echo base_url('style/js/bootstrap-table.min.js');?>"></script> 11 </head> 12 <body> 13 <?php 14 $sess = $this->session->userdata('user'); 15 echo "用户名是".$sess['name']; 16 ?> 17 <a href="<?php echo base_url('work2/out');?>">注销登录</a><br> 18 19 <input type="text" id="test" placeholder="输入用户id" > 20 <input type="text" id="test1" placeholder="输入用户名" > 21 <input type="button" value="找它" id="name"> 22 <table id="table" data-toggle="table" 23 data-url="<?php echo base_url('work2/page');?>" 24 data-pagination="true" 25 data-side-pagination="server" 26 data-query-params="queryParams" 27 > 28 <thead> 29 <tr> 30 <th data-field="uid" data-filter-control="input">ID</th> 31 <th data-field="username">用户名</th> 32 <th data-field="password">用户密码</th> 33 </tr> 34 </thead> 35 </table> 36 37 <script> 38 function queryParams(params) { 39 var uid = $("#test").val(); //获取文本框的值 40 var name = $("#test1").val(); //获取文本框的值 41 params.search1 = uid; 42 params.search2 = name; 43 return params; 44 } 45 46 $('#name').click(function () { 47 $('#table').bootstrapTable('refresh') 48 }) 49 </script> 50 51 </body> 52 </html>
后端处理：就是获得这个数据之后在数据库搜索就行
1 $search = $this->input->get('search2'); //这个是查用户名 2 $search1 = $this->input->get('search1'); //这个是查uid 3 4 if(empty($search) && empty($search1)){ 5 //两个空则输出全部数据 6 $rows = $this->db->limit($limit,$offset)->get('user1')->result(); 7 $count = $this->db->count_all('user1'); 8 }else if(empty($search) && $search1 != " " ){ 9 //用户名空，查uid 10 $rows = $this->db->like('uid',$search1)->limit($limit,$offset)->get('user1')->result(); 11 $count = $this->db->like('uid',$search1)->count_all_results('user1'); 12 } 13 else if(empty($search1) && $search != " " ){ 14 //uid空，查用户名 15 $rows = $this->db->like('username',$search)->limit($limit,$offset)->get('user1')->result(); 16 $count = $this->db->like('username',$search)->count_all_results('user1'); 17 }else{ 18 //一起查 19 $rows = $this->db->like('uid',$search1)->like('username',$search)->get('user1')->result(); 20 $count = $this->db->like('uid',$search1)->like('username',$search)->count_all_results('user1'); 21 } 22 $data = array( 23 'total'=>$count, 24 'rows'=>$rows 25 ); 26 echo json_encode($data);
效果图：
