bootstroop table 自定义搜索

  <div class="col-sm-12 ">
      <div class="box">
            <div class="box-header">
              <h3 class="box-title">设备信息</h3>
            </div>
             <div id="toolbar">
                     1:<input id="s1" name="id" class="search">
                     2:<input id="s2" name="DeviceName" class="search">
                     <input type="button" onclick="searchkey();"value="search">
            </div>
            <div class="box-body">
                  <table class="table  table-bordered table-striped"  id="mytab" ></table>
             </div>
      </div>
 </div>

 

下面是js

 

<script>
  function refresh(){//刷新
     var nullparamss = {}; 
     $("#mytab").bootstrapTable("refresh", nullparamss);
  }
  function autoRefresh(){//自动刷新
     setTimeout(refresh,30000);
  }
 
  $('#mytab').bootstrapTable('resetSearch', {
                    height: tableHeight()
                })
  $(function () {
 
             $("#refresh").click(function () {
                       refresh();
              });
     
            $(window).resize(function() { //根据窗口调整表格高度
                $('#mytab').bootstrapTable('resetView', {
                    height: tableHeight()
                })
            })

  
            $('#mytab').bootstrapTable({
                url: "http://localhost/bootstrap/getJsonData?method=index2",//数据源
                dataField: "rows",//服务端返回数据键值 就是说记录放的键值是rows，分页时使用总记录数的键值为total
                totalField: 'total',
                height: tableHeight(),//高度调整
                sidePagination: "server",//服务端分页
                method: "get",//请求方式
                pagination: true,//是否分页
                escape: true,
                pageNumber: 1,
                totalRows: 0, // server side need to set
                queryParams: function getParams(params) {
                    var searchKey1 = $("#s1").val(); 
                    var searchKey2 = $("#s2").val(); 
                    var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                             limit: params.limit, //页面大小
                             searchKey1:searchKey1,
                             searchKey2:searchKey2,
                             sortName:this.sortName,
                             sortOrder:this.sortOrder,
                             pageindex:this.pageNumber//当前页码
                              };
                       return temp;
                },
                buttonsAlign: "left",//按钮对齐方式
                selectItemName: 'id',
                //uniqueId: "id",      //每一行的唯一标识，一般为主键列
                toolbar: "#toolbar",
                toolbarAlign: 'left',
                columns: [
                    {
                        title: "全选",//标题
                        width: 60,//宽度
                        align: "center",//水平
                        checkbox: true,
                        valign: "middle"//垂直
                     
                    },
                    {
                        field: "id",
                        title: "id",
                        sortable: true
                    },
                    {
                        field: "DeviceName",
                        title: "DeviceName",
                        sortable: true
                    }
                ],
                onRefresh: function (params) {
                    if($("#refreshWay .active").data("toggle")=== "off"){
                             autoRefresh();
                    }
          },
                locale: "zh-CN"//中文支持
            });
    });

    function searchkey(){
                 var nullparamss = {}; 
                   $("#mytab").bootstrapTable("refresh", nullparamss);
    }
     function tableHeight() {
            return $(window).height() - 219;
        }
    
        function infoFormatter(value, row, index)
        {
            return "<a href='detail.html'>id:" + row.id + " description:" + row.description + " done:" + row.done+"</a>";
        }
</script>