Programación Java: Cargar datos en una lista desplegable

Supongamos que queremos agregar un registro a una tabla que se relaciona mediante una clave foránea con otra, solo requiere que se le ingrese el código o id, pero colocar ello en una caja de texto es incómodo, lo ideal sería desplegar en una lista desplegable vertical los registros de la tabla cuyo identificador o código queremos mostrar. Ilustremos ello con un ejemplo:

Sin lista desplegable	Con lista desplegable
Agregar datos Ingrese el código del inquilino Ingrese el monto	Agregar datos Seleccione el inquilino Ingrese el monto

Trabajaremos con las siguientes tablas:

Además, le vamos a crear una vista a la tabla "pagos" (para saber como crear este código paso a paso has clic aquí)

Si deseas ver la implementación para visualizar la tabla "pagos" en un JSP (has clic aquí)

Primero vamos a crear una función en el "DaoInquilinos" (clic aquí para ver como realizar el DAO):

package dao;
import java.util.List;
import dto.Inquilinos;

public interface DaoInquilinos {
    public List <Inquilinos> inquilinosSel();
    public Inquilinos inquilinosGet(Integer id);
    public String inquilinosIns(Inquilinos inquilino);
    public String inquilinosUpd(Inquilinos inquilino);
    public String inquilinosDel(List<Integer> ids);
    public List<Object[]> inquilinosCbo();
    public String getMessage();
}

Y la implementación para la función "inquilinosCbo"sería en el "DaoInquilinosImpl.java" (clic aquí para ver la implementación completa):

 
    @Override
    public List<Object[]> inquilinosCbo() {
        List<Object[]> list = null;
        StringBuilder sql = new StringBuilder();
        sql.append("SELECT ")
                .append("idinquilinos,")
                .append("dni,")
                .append("nombres,")
                .append("paterno,")
                .append("materno")
                .append(" FROM inquilinos");
        try (Connection cn = conectaDb.conexionDB()) {
            PreparedStatement ps = cn.prepareStatement(sql.toString());
            ResultSet rs = ps.executeQuery();
            list = new ArrayList<>();
            while (rs.next()) {
                Object[] inquilino = new Object[5];                
                inquilino[0]=rs.getInt(1);
                inquilino[1]=rs.getString(2);
                inquilino[2]=rs.getString(3);
                inquilino[3]=rs.getString(4);
                inquilino[4]=rs.getString(5);
                list.add(inquilino);
            }
        } catch (SQLException e) {
            mensaje = e.getMessage();
        }
        return list;
    }

En "PagosValidator" agregar una función llamada "pagosCbo" (has clic para ver el Validator original)

 
    public void pagosCbo() {
        List<Object[]> inquilinos = daoInquilinos.inquilinosCbo();
        request.setAttribute("inquilinos", inquilinos);
    }

Modificar el Servlet agregando una nueva funcionalidad (has clic para ver el Servlet original):

 
                case "CBO":
                validator.pagosCbo();
                target = request.getParameter("target") + ".jsp";
                break;

Crear un botón o enlace que llame a una función de JS que llamaremos: "pagosIns();"

 
    <a href="#" onclick="pagosIns();">
        Agregar pago
    </a>

El código JavaScript sería:

 
   function pagosIns() {
       window.location = "Pagos?accion=CBO&target=pagosIns";
   }

Nuestro "target" o lugar a donde apuntamos es "pagosIns" que en el Servlet es aumentado con la extensión ".jsp", por lo que requerimos crear un JSP que se llame "pagosIns.jsp", que sería el siguiente:

<%@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>Agregar un pago</title>        
    </head>
    <body>
        <a href="pagos.jsp">Regresar</a><br/>
       <h1>Agregar pago</h1>
        <form action="Pagos" method="post" style="margin: auto; display: table"> 
            <input type="hidden" name="accion" value="INS"/>
            <fieldset>
                <legend>Agregar datos</legend>
                <br/>
                <label>Seleccione el inquilino</label> 
                <select name="inquilino">
                    <c:forEach var="i" items="${inquilinos}">
                        <option value="${i[0]}">${i[1]} - ${i[2]} ${i[3]} ${i[4]}</option>
                    </c:forEach>
                </select>
                <br/><br/>
                <label>Ingrese el monto</label> 
                <input type="number" name="monto" style="width: 400px" min="0.01" step="0.01"/>                
                <br/>    
                <br/><p style="text-align: center;">
                    <button type="submit">Agregar</button>
                </p>               
            </fieldset>
        </form>
        <c:if test="${message != null}">
            <div>${message}</div>
        </c:if>
    </body>
</html>

Tendríamos algo similar a:

Programación Java

Páginas

jueves, 24 de octubre de 2019

Cargar datos en una lista desplegable

Estructura

1 comentario: