1：新增條件的表單

<div id="cc" class="easyui-layout" fit="true">   
	    <div data-options="region:'north',title:'North Title',split:true" style="height:100px;">
	    	
	    	<!-- 條件查詢的表單 -->
	    	<form id="s_form" method="get">
	    		name:<input class="easyui-textbox" name="name" data-options="iconCls:'icon-search'" 
	    				style="width:200px"> 
	    		| type:<input class="easyui-radiobutton" name="type" value="1" label="收入:">
	    			<input class="easyui-radiobutton" name="type" value="2" label="支出:">
	    		| cg: <select id="cg" class="easyui-combobox" name="cg" style="width:200px;">   
						    <option value="0">請選擇</option>   
						    <option value="1">餐飲</option>   
						    <option value="2">交通</option>   
						    <option value="3">購物</option>   
						</select>  
						
			 	| price:<input name="price" class="easyui-textbox"  style="width:200px">
	    	</form>
	    	<!-- 搜尋按鈕 -->
	    	<div style="float: right;">
		    	<a id="btn" href="javascript:queryBook()" class="easyui-linkbutton" data-options="iconCls:'icon-search'">搜尋</a>  
		    	<a id="btn" href="javascript:resetBookForm()" class="easyui-linkbutton" data-options="iconCls:'icon-search'">重置</a>  
	    	</div>
	    </div>   
	    <div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;">
	    	<!-- datagrid表格 -->
	    	<table id="bookList"></table>  
	    </div>   
	</div>  
 

2：點選搜尋，傳遞條件資料

//先獲取資料
		//獲取到name文字框的值
		var name = $("#name").val();
		//type:
		/* 
			<input class="easyui-radiobutton" name="type" value="1" label="收入:">
    		<input class="easyui-radiobutton" name="type" value="2" label="支出:">
		*/
		var type = $("input[name='type']:checked").val();
		/* 
			<select id="s_cg" class="easyui-combobox" name="cg" style="width:200px;">   
				    <option value="0">請選擇</option>   
				    <option value="1">餐飲</option>   
				    <option value="2">交通</option>   
				    <option value="3">購物</option>   
				</select>  
		*/
		var cg = $("#s_cg option:selected").val();
		/* <input id="s_price" name="price" class="easyui-textbox"  style="width:200px"> */
		var priceMin = $("#s_price_min").val();
		var priceMax = $("#s_price_max").val();
		var timeMin = $("#time_min").val();
		var timeMax = $("#time_max").val();
		
 

在datagrid當中新增  queryParams屬性，傳遞資料

queryParams: {//將資料傳遞到後臺
				name: name,
				type: type,
				cg: cg,
				priceMin: priceMin,
				priceMax: priceMax,
				timeMin: timeMin,
				timeMax: timeMax
			},

後臺定義vo類
注意：可以在Book物件中新增需要的屬性，但是，建議重新建立VO類，當公司協同開發的時候，這個類Book不一定只有你使用。建立自己的vo。

@Data
public class BookVO extends Book{

	 private Integer priceMin;
	 private Integer priceMax;
	 
	 @DateTimeFormat(pattern="yyyy-MM-dd")
	 private Date timeMin ;
	 @DateTimeFormat(pattern="yyyy-MM-dd")
	 private Date timeMax ;	
}
 

@ResponseBody
	@RequestMapping("listUser")
	public Map<String, Object> listUser(Integer page,Integer rows,BookVO vo) {

3：mybatis條件查詢語句

<!-- List<Book> listBook1(BookVO vo); -->
	<select id="listBook1" parameterType="bookVO" resultType="book">
			SELECT
				*
			FROM
				t_book b
			<where>
				<if test="name != null">
					AND	b.NAME LIKE CONCAT("%",#{name},"%")
				</if>
				<if test="type != null">
					AND b.type = #{type}
				</if>
				<if test="cg != null and cg != 0">
					AND b.cg = #{cg}
				</if>
				<if test="priceMin != null">
					AND b.price > #{priceMin}
				</if>
				<if test="priceMax != null">
					<![CDATA[ AND b.price < #{priceMax} ]]>
				</if>			
				<if test="timeMin != null">
					AND b.time > #{timeMin}
				</if>			
				<if test="timeMax != null">
					<![CDATA[ AND b.time < #{timeMax} ]]>
				</if>			
			
			</where>
	</select>

注意：
1： 小於號處理：<![CDATA[ AND b.price < #{priceMax} ]]>
2：拼接sql的mysql函式：CONCAT("%",“spring”,"%")

CONCAT("%","spring","%") 等價於 "%spring%"

4：重置

/* 重置表單 */
	function resetBookForm(){
		//1：重置表單
		$("#s_form").form("reset");
		//2：重新載入資料
		initTable();
	}