首页 > 代码库 > jqGrid的搜索框下拉
jqGrid的搜索框下拉
当需要在jqGrid的搜索框里配置搜索条件时，如下拉，日期等，代码如下：
1 datePick = function(elem)2 {3 jQuery(elem).datepicker();
4 }
1 colNames : [ "OP_ID", "OP_Module", "OP_Type", "OP_Content", "Operator", "OperatorType", "OP_Time", "OP_IP"], 2 colModel : [{name:‘op_id‘, index:‘op_id‘, width:100, align:‘center‘, editable:false, search:false}, 3 {name:‘op_module‘, index:‘op_module‘, width:110, align:‘center‘, search:true, editable:false, 4 stype:‘select‘, searchoptions: {dataUrl:‘./select/module‘, sopt:[‘eq‘, ‘ne‘]}}, 5 {name:‘op_type‘, index:‘op_type‘, width:100, align:‘center‘, search:true, editable:false, 6 stype:‘select‘, searchoptions: {dataUrl:‘./select/type‘, sopt:[‘eq‘, ‘ne‘]}}, 7 {name:‘op_content‘, index:‘op_content‘, width:250, align:‘center‘, editable:false, sortable:false, 8 stype:‘text‘, searchoptions: {sopt:[‘bw‘, ‘bn‘, ‘ew‘, ‘en‘,‘cn‘, ‘nc‘]}}, 9 {name:‘op_by‘, index:‘op_by‘, width:100, align:‘center‘, search:true, editable:false},10 {name:‘operator_type‘, index:‘operator_type‘, width:130, search:true, align:‘center‘, editable:false,11 stype:‘select‘, searchoptions: {dataUrl:‘./select/operator_type‘, sopt:[‘eq‘, ‘ne‘]}},12 {name:‘op_at‘, index:‘op_at‘, width:170, align:‘center‘, search:true, editable:false, 13 stype:‘text‘, searchoptions: {dataInit:datePick, attr:{title:‘Select Date‘}, sopt:[‘cn‘, ‘nc‘, ‘in‘, ‘ni‘]}, formatter:‘date‘, formatoptions:{srcformat: ‘Y-m-d H:i:s‘, newformat: ‘m/d/Y H:i:s‘}},14 {name:‘op_ip‘, index:‘op_ip‘, width:100, align:‘center‘, search:true, editable:false}15 ],
其中，colModel的属性的stype有“text”和“select”两种，需要下拉选项时，则选择“select”；同时，searchoptions也进行设置，dataUrl为请求路由，路由返回的数据是
<select><option>1</option></select>的格式；重要的是需设定：ajaxSelectOptions: {type: "GET"} ，其中type可以是Post，这样你的搜索才能返回数据。
1 jQuery(grid_selector).jqGrid({ 2 url : "./show_log",3 datatype : "json",4 mtype : "post",5 height : 370,6 width : 1150,7 ajaxSelectOptions : {type: "GET"} ,
而想显示日期选择框时，stype设定为“type”，searchoptions: {dataInit:datePick, attr:{title:‘Select Date‘}, sopt:[‘cn‘, ‘nc‘, ‘in‘, ‘ni‘]},
formatter:‘date‘, formatoptions:{srcformat: ‘Y-m-d H:i:s‘, newformat: ‘m/d/Y H:i:s‘}}。其中，formatoptions可以自己设置需要的格式。
jqGrid的搜索框下拉
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。