viernes, 29 de octubre de 2010

COMBO DEPENDIENTE PRIMEFACES

Ésta es la solución que propongo para desarrollar un combo dependiente de otro con Primefaces 2.2.1, y SIN NECESIDAD DE RECARGAR LA PÁGINA:

Éste es el código HTML:

<h:outputLabel for="cuentaGrafica" value="Cuenta: " />
<h:selectOneMenu id="cuentaGrafica" immediate="true"
                            validator="comboCuentaGraficaValidator"
                            validatorMessage="Debe seleccionar una cuenta"
                            value="#{movimientosBean.movimientoDTOGrafica.cuentaDTO.id}">
                            <f:selectItem itemLabel="Seleccione una opción" itemValue="0" />
                            <f:selectItems value="#{cuentasBean.listaCuentasDTO}"
                                var="cuenta" itemLabel="#{cuenta.numeroCuenta}"
                                itemValue="#{cuenta.id}" />
                            <p:ajax update="anioGrafica"
                                actionListener="#{movimientosBean.cargaListaAnios}" />
                        </h:selectOneMenu>

<h:outputLabel for="anioGrafica" value="Año: " />
                        <h:selectOneMenu id="anioGrafica"
                            value="#{movimientosBean.movimientoDTOGrafica.anio.anio}">
                            <f:selectItem itemLabel="Seleccione una opción" itemValue="0" />
                            <f:selectItems value="#{movimientosBean.listaAnios}" var="anio"
                                itemLabel="#{anio.anio}" itemValue="#{anio.anio}" />
                        </h:selectOneMenu>


Y éste es el código Java del Backing Bean:

public void cargaListaAnios(ActionEvent event) {

        Integer idCuenta = (Integer) event.getComponent().getAttributes().get(
                "value");

        try {
            setListaAnios(gestorMovimientos.recuperaListaAnios(idCuenta));
        } catch (BusinessException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }

Cuando el usuario selecciona una cuenta en el primer combo, salta el Listener asociado al evento de cambio de valor de dicho combo,  pudiendo acceder a BDD para cargar el segundo combo con los items dependientes de nuestra elección

17 comentarios:

  1. esta muy interesante esta propuesta pero me gustaria que pusieras el codigo de los beans y si no es mucho pedir me podrias rotar el proyecto para analizarlo

    ResponderEliminar
  2. Sólo necesitas saber que el método "cargaListAnios" del bean MovimientosBean, recupera de la base de datos un listado, y luego lo setea a la lista de años "listaAnios" del mismo bean.

    Un saludo.

    ResponderEliminar
  3. Perfecto, me costó un poco pero al final pude hacerlo funcionar, gracias...!!

    ResponderEliminar
    Respuestas
    1. Podrias decirme si hicistes algun cambio en el xhtml que esta propuesto en el foro

      Eliminar
    2. Puedes publicar las observaciones que tuvistes que hacer al codigo, te agradecería mucho.

      Eliminar
  4. Al tratar de hacerlo funcionar con 3 combos, no funciona, no se está enviando el valor seleccionado del 2do combo para llenar el tercero, alguna sugerencia...?

    ResponderEliminar
  5. Entiendo que quieres hacer un tercer combo dependiente del segundo. La idea en ese caso es la misma:

    <h:selectOneMenu id="anioGrafica" value="#{movimientosBean.movimientoDTOGrafica.anio.anio}">
    <f:selectItem itemLabel="Seleccione una opción" itemValue="0" />
    <f:selectItems value="#{movimientosBean.listaAnios}" var="anio" itemLabel="#{anio.anio}" itemValue="#{anio.anio}">
    <p:ajax update="idDelTercerCombo" actionListener="#{movimientosBean.cargaListaDelTercerCombo}"/>
    </f:selectItems>
    </h:selectOneMenu>


    La lógica de negocio del método "cargaListaDelTercerCombo" sería análoga a la que ya hemos usado para recargar el segundo combo, mutatis mutandis.

    ResponderEliminar
  6. tengo el mismo problema con el tercer combo en el típico ubigeo... y si he hecho la misma logica pero no va al servidor... no sera un bug del framework?... Miguelon tu has utilizado con 3 combos y funcionó?.. si te funciono que version del prime estas utilizando... gracias

    ResponderEliminar
  7. A mi me pasa igual, el segundo no esta enviando la informacion que lleva para que el tercero se despliegue.

    ResponderEliminar
  8. ademas cuando le doy guardar, me sale un error diciendo que los selectonemenu no han sido seleccionados y se reinicias, es decir vuelven a estar en selecciona una opcion..

    ResponderEliminar
  9. Yo hago lo mismo pero utilizo JSF 2.1 y PrimeFaces 3.5, pero tengo un problema, cuando selecciono algo del primer combo no me actualiza el segundo, tengo que actualizar la página para que me cargue las opciones del segundo combo dependiendo de la selección del primero ¿alguna idea del por qué sucede esto? Gracias

    ResponderEliminar
    Respuestas
    1. Debes indicar el id del componente a actualizar. Si aún así no se actualiza, deberás indicar el id de algún componente que contenga a ambos combos

      Eliminar
  10. miguelon me gustaria saber si lo pudiste hacer andar con tres combos porque al igual que la resto no me funciona

    ResponderEliminar
  11. Buenas tardes yo tambien estoy interesado en saber como se puede hacer con tres combos, por que no funciona si se hace de la misma manera que 2 combos.

    ResponderEliminar
  12. una pregunta yo tengo dos combox dependientes pero no puedo hacer que cuando seleccione una opcion del primer combox en el segundo me muestre determinados valores... es decir me muestra todos los datos de la BDD pero no los espeficicos para la opcion seleccionada

    ResponderEliminar
  13. En el listener debes cargar en el listado del segundo combobox los valores específicos para la opción seleccionada, y debes añadir en el

    ResponderEliminar
  14. nadie T_T quiero para el tercer combo y no me sale con la misma lógica que dice

    ResponderEliminar