黑马旅游网编写练习(8)--旅游线路查询功能

黑马旅游网编写练习(8)–旅游线路查询功能

用户可以通过点击分类目录来查询旅游路线，当然也可以直接通过搜索框进行搜索。接下来便进行搜索框搜索并展示功能的编写。

分析
点击搜索框也是对数据库中旅游路线表tab_route进行查询，而在RouteDao中，之前已经编写了一个查询tab_route表中数据的方法；在service层也有了将查询到的数据进行分页展示的方法。接下来可以在dao层重载一个方法，在该方法中增加一个搜索框的数据String类型；而在service层，可以直接添加参数，也可以重载一个页面查询方法；为了减少代码的重复，****在service层，便直接增加参数。****而在dao层进行方法的重载。

前端参数分析
旅游路线的搜索框是一直存在的，用户可以在主页直接搜索；也可以在点击了下面的某一个旅游分类后再进行搜索；还可以在某一个旅游路线的详细界面进行搜索；不管在那个页面进行了搜索，我们都让其跳转到旅游页面展示界面，即route_list.html页面。该页面会自动向服务器发送Ajax请求，获取旅游路线，并分页展示。由于是搜索，所以我们需要将搜索框的内容也传递给服务器，所以在页面跳转时，需要传递搜索框的内容search_input；由于route_list.html页面中cid是通过请求路径获取的，所以在跳转到此页面时，也需要将cid参数一起传递过来。
header.html中点击搜索框的代码如下：

    // 为搜索框绑定单击事件
    $(".search-button").click(function () {
   

        // 获取cid，获取search_input
        var cid = getParameter("cid");
        var search_input = $(".search_input").val();

        // 跳转到route_list页面
        location.href="http://localhost/travel/route_list.html?cid="+cid+"&search_input="+search_input;
    });

然后在route_list.html页面接收这两个参数，并将Ajax请求中添加一个参数。接收时，因为可能有中文，所以需要进行url解码

    // 根据请求当前资源的路径获取cid
    // http://localhost/travel/route_list.html?cid=7
    var cid = getParameter("cid");
    var search_input = getParameter("search_input");
    // url解码
    search_input = window.decodeURIComponent(search_input);

注意，在Ajax请求中添加了参数后，需要在所有调用该方法的地方都加上一个参数。注意！在页码处拼接字符串时，搜索的内容是字符串，所以要加上引号；否则参数传不成功。

dao层查询方法的重载

加入了搜索，所以需要设置sql拼接，不管是只根据搜索值，还是只根据cid，还是两个一起，都能实现查询；首先重载findTotalCount方法，具体代码如下：

    /**
     * 根据cid，或者search_input查询指定目录下的数据总条数
     * @param cid
     * @param search_input
     * @return
     */
    @Override