bootstrap-table的queryParams使用

时间：2024-03-10 07:52:57

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);

 

效果图：

 

相关文章