10jqGrid - 搜索操作

表格中所有的列都可以作为搜索条件。
所用到的语言包文件

$.jgrid = {  

...  
   search : {  
     caption: "Search...",  
     Find: "Find",  
     Reset: "Reset",  
     odata : ['equal', 'not equal', 'less', 'less or equal','greater','greater or equal', 'begins with','does not begin with','is in','is not in','ends with','does not end with','contains','does not contain'],  
     groupOps: [ { op: "AND", text: "all" }, { op: "OR", text: "any" } ],  
     matchText: " match",  
     rulesText: " rules"  
   }

colModel 设置:
10jqGrid - 搜索操作
searchoptions 参数:
10jqGrid - 搜索操作

jQuery("#grid_id").jqGrid({  
...  
   colModel: [   

      ...   

      {name:'price', index:'price', width:60, search:true, stype:'text', searchoptions:{dataInit:datePick, attr:{title:'Select Date'}} },  

      ...  

   ]  

...  

});  

datePick = function(elem)  

{  
   jQuery(elem).datepicker();  
}

需要说明的:

  • 所有的搜索都是使用url来到服务器端查询数据。
  • 当执行搜索时会用查询数据填充postData array
  • 发送到服务器端搜索字符串的名称为_search
  • 当点击刷新按钮时不会使用搜索条件
  • 每个搜索方法都有自己的数据清空方法

搜索工具栏

搜索工具栏只是在列标题下面构造一个输入框。且使用表格的url进行搜索记录,发到服务器端数据格式为name:value,而且是附加在postData之后。

  • jQuery("#grid_id").filterToolbar(options);
  • jQuery("#grid_id").jqGrid(‘filterToolbar’,options);

options:参数
10jqGrid - 搜索操作

方法:
10jqGrid - 搜索操作

自定义搜索

<div id="mysearch"></div>

jQuery("#mysearch").filterGrid('#grid_id',options);

options:参数
10jqGrid - 搜索操作
10jqGrid - 搜索操作

 

上一篇:java基础 笔记4 面向对象 包、继承,final,super,toString(),equal


下一篇:HttpRunner2.X 版本和 3.X 版本的区别到底有哪些?(吐血总结!)