美文网首页程序员
用Java如何实现搜索功能?

用Java如何实现搜索功能?

作者: itcode | 来源:发表于2017-12-19 21:53 被阅读3045次

    首先,我们要清楚搜索框中根据关键字进行条件搜索发送的是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集合进行搜索

    image.png

    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}">
    

    value="${param.productName}"是从请求url的参数中获取值,实现在输入关键字搜索后刷新页面显示关键字这一功能,直接上图:

    image.png

    在输入中文关键字进行搜索时,可以使用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如何实现搜索功能?

        本文链接:https://www.haomeiwen.com/subject/fnniwxtx.html