首先,我們要清楚搜索框中根據關鍵字進行條件搜索發送的是Get請求,并且是向當前頁面發送Get請求
//示例代碼 請求路徑為當前頁面路徑 "/product" <!-- 搜索框 get請求 根據商品名稱的關鍵字進行搜索--><form action="/product" class="form-inline pull-left" > <input type="text" name="productName" placeholder="商品名稱" class="form-control" value="${param.productName}"> <button class="btn btn-primary"><i class="fa fa-search"></i></button></form>
當我們要實現多條件搜索功能時,可以將搜索條件封裝為一個Map集合,再根據Map集合進行搜索
Controller層代碼:
@GetMapping("/product") public String list(@RequestParam(required = false,defaultValue = "1",name = "p")Integer pageNo, @RequestParam(required = false,defaultValue = "")String productName, @RequestParam(required = false,defaultValue = "")String place, @RequestParam(required = false,defaultValue = "")Integer typeId, @RequestParam(required = false,defaultValue = "")BigDecimal minPrice, @RequestParam(required = false,defaultValue = "")BigDecimal maxPrice, Model model) { Map<String,Object> searchParam = new HashMap<>(); searchParam.put("productName",productName); searchParam.put("place",place); searchParam.put("typeId",typeId); searchParam.put("minPrice",minPrice); searchParam.put("maxPrice",maxPrice); PageInfo<Kaola> pageInfo = kaolaService.findByPageNo(pageNo,searchParam); model.addAttribute("pageInfo",pageInfo); return "product/list"; }
業務層代碼:
public PageInfo<Kaola> findByPageNo(Integer pageNo, Map<String, Object> searchParam) { PageHelper.startPage(pageNo,10); List<Kaola> kaolaList = kaolaMapper.findBySearchParamWithType(searchParam); return new PageInfo<>(kaolaList);}
MyBatis中的mapper.xml:
<select id="findBySearchParamWithType" resultType="com.kaishengit.entity.Kaola"> SELECT kaola.*, kaola_type.id AS 'kaolaType.id', kaola_type.type_name AS 'kaolaType.typeName', parent_id AS 'kaolaType.parentId' FROM kaola INNER JOIN kaola_type ON kaola.type_id = kaola_type.id <where> <if test="productName != null and productName != ''"> kaola.product_name LIKE concat('%',#{productName},'%') </if> <if test="place != null and place != ''"> and kaola.place = #{place} </if> <if test="typeId != null and typeId != ''"> and kaola.type_id = #{typeId} </if> <if test="minPrice !=null and minPrice != ''"> <![CDATA[ and kaola.price >= #{minPrice} ]]> </if> <if test="maxPrice !=null and maxPrice != ''"> <![CDATA[ and kaola.price <= #{maxPrice} ]]> </if> </where> ORDER BY kaola.id DESC</select>
這樣,就可以從前端到后端實現多條件搜索功能了。我們還會遇到這樣一種情況,在輸入搜索條件時,顯示列表會不斷自動刷新,這里其實用到了Ajax的相關內容,在輸入的過程中,會不斷發出Ajax請求,然后刷新頁面。
<input type="text" name="productName" placeholder="商品名稱" class="form-control" value="${param.productName}">
是從請求url的參數中獲取值,實現在輸入關鍵字搜索后刷新頁面顯示關鍵字這一功能,直接上圖:
value="${param.productName}"
在輸入中文關鍵字進行搜索時,可以使用encodeURIComponent解決url路徑顯示中文亂碼問題:
//分頁$('#pagination-demo').twbsPagination({ totalPages: ${pageInfo.pages}, visiblePages: 10, first:'首頁', last:'末頁', prev:'上一頁', next:'下一頁', href:"?productName="+encodeURIComponent('${param.productName}')+"&place="+encodeURIComponent('${param.place}') + "&typeId=${param.typeId}&minPrice=${param.minPrice}&maxPrice=${param.maxPrice}&p={{number}}"});
點擊查看大圖
搜索結果
總結
以上所述是小編給大家介紹的Java實現搜索功能代碼詳解,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對VeVb武林網網站的支持!
新聞熱點
疑難解答
圖片精選