jqGrid自定义查询

　　为grid构造一个自定义查询表单，此方法使用jqGrid使用的url地址用于提交数据，提交查询后，键值对对象提交到服务器，这个数据被附加到postData参数中，仅提交输入过内容的字段。清空表单时，查询内容将会从postData中删除。提交服务器的数据，不是name，而是colModel中配置的index，当找不到index配置时才使用name，同时附加额外的数据 a _search=true到需要提交的数据。

安装

要使用这个方法，需要在下载页面勾选 Custom后再下载jqGrid，下载地址：http://www.trirand.com/blog/?page_id=6。

调用方式和选项

需要定义查询表单再DOM中，可以再grid的上面或者下面

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

JS


jQuery("#mysearch").filterGrid('#grid_id',options);
//新API
jQuery("#mysearch").jqGrid('filterGrid','#grid_id',options);

方法说明

  • grid_id ：使用查询的表格id
  • options ：相关配置，可用值如下表
配置 描述 默认值
gridModel 设置为true，使用colModel中参数来构造查询，使用的colModel参数有： name, index, edittype, editoptions, search
仅此方法中可以在colModel中设置附加参数满足其他需求。这些特别的参数为：
  • defval ：设置输入对象的默认值
  • surl ：尽在edittype为select时有效。从哪个url地址构造select元素，需要返回如下HTML代码
    <select>
<option value='val1'> Value1 </option>
<option value='val2'> Value2 </option>
…
<option value='valn'> ValueN </option>
</select>

colModel中设置了search:true的列才会添加到表单中，隐藏元素未添加。
设置为false的话，我们需要设置filterModel（参考下面）来构造查询		 false
gridNames gridModel为true时有效。设置为true使用jqGridt的colNames作为查询输入项的描述（label） false
gridToolbar 过时的方法，已经被filterToolbar （jqGrid工具栏查询）方法替换。 false
filterModel gridModel设置为false时需要设置这个配置。
filterModel [
…
{label:'LableFild', name: 'colname', stype: 'select', defval: 'default_value', surl: 'someurl', sopt:{optins for the select}},
…

  • label ：字段描述（文本描述）
  • name：列的名称，需要和colModel配置的name一致。注意：对此列的index进行查询（Note that we search on the index of that coulmn.）
  • stype ：查询元素类型，可以为'text' or 'select'
  • defval：输入元素默认值
  • surl：仅对stype为select时有效，从哪个url下载select的html代码。示例
    <select>
<option value='val1'> Value1 </option>
<option value='val2'> Value2 </option>
…
<option value='valn'> ValueN </option>
</select>
  • sopt ：可以用于此对象的操作符，和colModel中的editoptions一样。
 []
formtype 表单如何构造，可以为水平（horizontal）或者垂直（vertical） horizontal
autosearch 设置为true有如下行为
  • 为text元素用户输入内容后按下Enter键执行查询
  • 为select元素，内容改变时触发查询（onchange）
设置为false，将使用按钮触发查询		 true
formclass 添加到表单的样式 “filterform”
tableclass 添加到表格的样式（这个表格为form表单的子元素） “filtertable”
buttonclass 按钮的样式 “filterbutton”
searchButton 查询按钮的内容（查询按钮内容(label)未再语言文件中配置，目的是为了将这个方法独立出来，可以用在其他地方，如，不使用jqGrid。） “Search”
clearButton 清除按钮显示的内容 “Clear”
enableSearch 是否启用查询按钮 false
enableClear 是否启用清除按钮 false
beforeSearch 查询前触发的事件 null
afterSearch 查询后触发的事件 null
beforeClear 清除数据前触发的事件 null
afterClear 清除数据后触发的事件 null
url 查询数据的独立url（a separate url for searching values） ''
marksearched 设置为true，查询后，被用于查询的列被标记为可查询的。例如，在此列表头左上角出现一个标记指示此列用于查询过。清楚查询内容后标记也会消失。在3.5-版本不适用。 true

附加方法

调用 filterGrid方法，还可以使用2个附加的特殊方法
triggerSearch ：触发grid查询，例如

var sg = jQuery("#mysearch").filterGrid(...)//[0]; 
sg.triggerSearch();

clearSearch ：清空查询表单的内容和使用默认值或者空值触发查询- clears the search form values and triggers the search with empty or default values.

sg.clearSearch();

		

			不用按照新APi的方式来调用，不起作用

	





	来源：http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_searching



	 


加支付宝好友偷能量挖...

	


原创文章，转载请注明出处：jqGrid自定义查询




评论(0)Web开发网


阅读(1776)喜欢(1)jqGrid中文API