0

Tengo un listado de pedidos y al hacer click en uno quiero que abra una nueva página con los detalles de ese pedido. Estuve leyendo y se puede hacer con ajax pero todos los que vi eran con form pero yo quiero que al hacer click en el div.

Pedidos.jsp

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Pedidos</title>
        <link href="css/menu.css" rel="stylesheet" type="text/css"/>
        <link href="css/bootstrap.css" rel="stylesheet" type="text/css"/>
        <link href="css/listaPedidos.css" rel="stylesheet" type="text/css"/>
        <link href="https://fonts.googleapis.com/css?family=Roboto:500" rel="stylesheet">
        <script src="js/jquery.js" type="text/javascript"></script>
        <script>
            function verDetalles(id){
                alert(id);
                $.ajax({
                    url: 'DetallesServlet',
                    dataType: 'json',
                    data: { miPostVar: id },
                    type: 'post'
                });
            }
        </script>
    </head>
    <body>
        <nav class="tab">
            <ul class="topnav">
                <li><a class="noactive" href="Actividad.jsp">Actividad</a></li>
                <li><a class="active" href="ConsultaPedidosServlet">Pedidos</a></li> 
            </ul>
        </nav>

        <c:forEach items="${repartos}" var="reparto">
            <div id="${reparto.pedido.id}" class="listaPedidos" onclick="verDetalles(this.id)">
                <p> #${reparto.pedido.id} </p>
                <p> ${reparto.pedido.descripcion} </p>
                <p> ${reparto.pedido.direccion} </p>
            </div>
        </c:forEach>

    </body>
</html>

DetallesServlet.java

@WebServlet(name = "DetallesServlet", urlPatterns = {"/DetallesServlet"})
public class DetallesServlet extends HttpServlet {

    private String id = null;

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        Consulta cons;
        try {
            cons = new Consulta("*", "pedidos");
            ResultSet rs = cons.recuperarPorId(Integer.parseInt(id));
            Pedido ped = null;
            if (rs.next()){
                ped = new Pedido(rs.getInt("id"), rs.getString("descripcion"), rs.getInt("precio"), rs.getString("direccion"), rs.getString("fechaHora"), rs.getString("comentario"), rs.getString("estado"));
            }

            request.setAttribute("pedido", ped);
                request.getRequestDispatcher("/DetallesPedido.jsp").forward(request, response);

        } catch (SQLException | ClassNotFoundException ex) {
            Logger.getLogger(ConsultaPedidosServlet.class.getName()).log(Level.SEVERE, null, ex.getMessage());
        } 

    }


    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {

            id = request.getParameter("miPostVar");
            doGet(request, response);

    }
}

1 respuesta 1

1

Si quiere cargar en otra pagina no es necesario el ajax puedes usar un link(a) enviando el id del pedido para redireccionarlo a otra pagina un ejemplo :

Pedidos.jsp

<c:forEach items="${repartos}" var="reparto">
    <div id="${reparto.pedido.id}" class="listaPedidos"
           onclick="verDetalles(this.id)">
        <p> #${reparto.pedido.id} </p>
        <p> ${reparto.pedido.descripcion} </p>
        <p> ${reparto.pedido.direccion} </p>
        <p> <a href="/DetallesServlet?id=${reparto.pedido.id}" /> </p>
    </div>
</c:forEach>

Y en el DetallesServlet.java recibes el id y haces la consulta:

protected void doGet(...) {
        String id = request.getParameter("id");Consulta cons;
    try {
        cons = new Consulta("*", "pedidos");
        ResultSet rs = cons.recuperarPorId(Integer.parseInt(id));
        Pedido ped = null;
        if (rs.next()){
            ped = new Pedido(rs.getInt("id"), rs.getString("descripcion"), rs.getInt("precio"), rs.getString("direccion"), rs.getString("fechaHora"), rs.getString("comentario"), rs.getString("estado"));
        }

        request.setAttribute("pedido", ped);
            request.getRequestDispatcher("/DetallesPedido.jsp").forward(request, response);

    } catch (SQLException | ClassNotFoundException ex) {
        Logger.getLogger(ConsultaPedidosServlet.class.getName()).log(Level.SEVERE, null, ex.getMessage());
    } 
    }

Y en el jsp DetallePedido lo muestras.

1
  • Muchas gracias! Funciona impecable! Commented el 8 nov. 2016 a las 18:57

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.