jqgrid自帶查詢

1查詢方式為通過加載遠程數據生成下拉列表供用戶選擇:

前臺：

//下拉列的數據
{
        				name : ‘applicationDeptId‘,
        				index : ‘applicationDeptId‘,
        				label : ‘申報部門‘,
        				width : 150,
        				//hidden : true,
        				editable : false,
        				editoptions : {
        					size : "20",
        					maxlength : "20"
        				},
                                        //設置查詢方式為下拉列表
        				stype : ‘select‘,
        			    searchoptions : {
        			    	sopt : [‘eq‘],
                                        //通過此地址來加載後臺傳入的數據
        			    	dataUrl	: "${contextPath}/sys/sysdept/getDepts"
        			    }
        			},        

後臺：

//後臺查詢數據，並封裝為下拉列表字符串然後傳入前臺
@RequestMapping(value="/getDepts",method={RequestMethod.POST,RequestMethod.GET})
public void getDepts(HttpServletRequest request,HttpServletResponse response) throws IOException{
		Search search = new Search();
		List<SysDeptEntity> deptList=sysDeptService.search(search);
		StringBuffer resultJson = new StringBuffer();
		resultJson.append("<select>");
		resultJson.append("<option value=‘‘>" + "" +"</option>");
		for(SysDeptEntity deptEntity : deptList){
			resultJson.append("<option value=‘" + deptEntity.getId() + "‘>" + deptEntity.getDeptName() +"</option>");
		}
		resultJson.append("</select>");
		writeJSON(response, resultJson.toString());
		
	}

2查詢性別一類的枚舉類型數據時(即此時1指代男生，2指代女生):

前臺:

{
					name : ‘sex‘,
    				index : ‘sex‘,
    				label : ‘性別‘,
    				width : 30,
    				editable : true,
    				edittype : "select",
    				editoptions : {value : "1:男;2:女"},
                    formatter : ‘select‘,
    				search : false,
    				formoptions:{rowpos:3,colpos:1}
				}
//此時當查詢時，傳入前臺的數據選擇男則是“1”(選擇女則是2)

3查詢與datepicker插件組合時(即查詢時間時通過選擇而不是由用戶輸入):

1.顯示時間

前臺:

//設置查詢框要顯示的樣式
datePick =  function(elem){
		                jQuery(elem).datetimepicker({
                                       //表示用戶選擇的時間最後只保留到分鐘
		               		format : ‘yyyy-mm-dd hh:ii‘,
		     				autoclose : true,
		     				language: ‘zh-CN‘
		                });
		            }
//jqgrid列
{
	       			     name : ‘constructEndTime‘,
	       			     index : ‘constructEndTime‘,
	       			     label : ‘施工結束時間‘ ,
	       			     width : 90,     
	       			     editable : true ,     
	       			     search : true,
	       			     editrules : {required : true},
	       			     formatter:‘date‘,
	       			     formatoptions:{srcformat: ‘Y-m-d H:i:s‘, newformat: ‘H:i:s‘},
        				 hidden:(hiddenColsJSON.constructEndTime==‘true‘),
        				 searchoptions: {
        					sopt : [‘eq‘,‘ne‘,‘lt‘,‘le‘,‘gt‘,‘ge‘],
        					dataInit:datePick,  //表示要引用的方法
        					attr:{title:‘選擇日期‘}
        				 }
	       			  }    

2.顯示日期(只選擇到‘天‘)

前臺:

//調用的方法
datePick2 =  function(elem){
		                jQuery(elem).datetimepicker({
		                	minView: "month",//設置只顯示到天
		               		format : ‘yyyy-mm-dd‘,
		     				autoclose : true,
		     				language: ‘zh-CN‘
		                });
		            }
//jqgrid的列
{
	       				name : ‘constructStartTime‘,
	       				index : ‘constructStartTime1‘,
	       				label : ‘施工日期‘,
	       				width : 90,
	       				editable : true,
	       				hidden:(hiddenColsJSON.constructStartTime==‘true‘),
	       				readonly : true,
	       				search : true,
	       				sorttype : ‘date‘,
	       				editrules : {date : true},
	       				formatter:‘date‘,
	       				formatoptions:{srcformat: ‘Y-m-d‘, newformat: ‘Y-m-d‘},
	       				searchoptions: {
	       					sopt : [‘eq‘,‘ne‘,‘lt‘,‘le‘,‘gt‘,‘ge‘],
	       					dataInit:datePick2,
	       					attr:{title:‘選擇日期‘}
	       				}
	       			}

jqgrid學習(二)