黑马旅游网编写练习(7)--某一旅游线路详情展示

黑马旅游网编写练习(7)–某一旅游线路详情展示

在分页展示的页面中，我们点击某一个旅游，想要查看详细信息，则点击了查看详情后，会跳转到该旅游路线对应的详细信息页面。接下来对该详细信息页面的查询与展示。
想要查看不同旅游线路对应相应的详细界面，我们首先观看一下数据库中两个数据表之间的关系。如下图所示：

旅游页面对应的表格内容是tab_route；详细页面中的一些信息（标题，价格）也在这个表格中；详情页面中的图片位于tab_route_img表格中，该表格与tab_route表格通过rid关联；详情页面中的商家信息位于tab_seller表格中，该表格通过sid与tab_route关联。

分析
当点击了查看详情后，会跳转到route_detail.html页面。若要该页面的内容是那一条旅游路相对应的内容，则首先需要通过一个参数来联系这三张表格；通过对这三个表格关系的分析，我们只有两个选择，第一个选择是传递sid，第二个选择是传递rid；接下来我们详细分析这两个选择方案。
方案1：选择传递sid
若传递sid。则我们可以通过sid直接查询表格tab_seller，从而获取商家信息；但是我们不能通过sid获取tab_route_img表格的信息；所以需要通过sid获取rid，再通过rid获取tab_route_img表格信息；但是由于sid有很多个，而rid只有1个，也就是说在表格中，一个sid，可能获取到很多个rid；（一个商家可能有多条旅游路线），那么就不能准确地获取到该线路对应的图片了；所以传递sid参数不行。

方案2：选择传递rid
若传递rid。一个rid可以查询到该路线对应的多张图片；同样也可以查询到该线路对应的一个商家sid；根据该商家的sid可以查询到商家的所有信息。所以传递rid参数可以实现三张表格数据的对应关系。

参数rid传递的前端实现

首先在前端点击产看详情按钮处添加rid参数的传递；具体实现代码如下：

    // 在route_list.html拼接字符串处添加rid参数
    <p><a href="route_detail.html?rid='+route.rid+'">查看详情</a></p>\n' +

接下来在route_detail.html中编写入口函数，接收rid参数，并向服务器发送Ajax请求：

    $(function () {
   
        // 获取rid参数
        var rid = getParameter("rid");
        // 向服务器发送Ajax请求；获取Route对象；并将对应数据展示到页面中。
        $.post("route/findOne",{
   rid:rid},function (route) {
   
            // 将响应的数据展示到页面中


        });
    });

接下来编写后端查询数据，并返回Route对象的代码。

后端查询旅游路线的详细信息

首先我们在与Route相关的Servlet，service，dao中添加方法；先来实现servlet的findOne方法，代码的主要内容如下：

    /**
     * 根据rid查询旅游路线的详细信息，响应Route对象给客户端
     * @param request
     * @param response
     * @throws IOException
     */
    public void findOne(HttpServletRequest request, HttpServletResponse response) throws IOException {
   
        // 接收rid
        String rid_str = request.getParameter("rid");
        // 判断rid是否为空
        if(rid_str == null || rid_str.length() == 0){
   
            System.out.println("rid为空，请求错误");
            return;
        }
        int rid = Integer.parseInt(rid_str);

        // 调用service层方法获取Route对象
        Route route = service.findOne(rid);

        // 将Route对象序列化为json，并响应给客户端
        responseJson(response,route);
    }

接下来编写service层的代码，service层需要通过rid去查询数据库中的三个表，并将表中的信息封装到Route对象中；对于数据库中三张表的查询，需要分别用三个dao对象进行查询，保持良好的对应关系。每张表都是通过id查询表中的全部内容，只不过有些内容是很多行，需要用集合存储，而有些数据是单独的一行，只需要用一个对象存储即可。首先编写三张表的查询代码。

先为图片查询创建一个RouteImgDao对象，在其中编写查询方法，具体代码如下：

    // 定义jdbc连接对象
    private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource());

    /