ADF tips: Incorporar un selector de fecha a un af:inputText
06/07/2015 -
Hace unos días un desarrollador posteó en los foros de Oracle que requería introducir el selector de fecha en un af:inputText que admitiría tanto valores de texto como fechas. En este ADF tips voy contaros la solución que aporté (link al post)
Para empezar debemos añadir un inputText y un inputDate:
El siguiente paso es asociar al inputText el valor que seleccionemos en el inputDate.
Para ello es necesario, poner en el inputDate la propiedad autoSubmit = true y utilizar el valueChangeListener para poder asignar el valor al inputText. También tenemos que añadir un partialTrigger al inputText para que se refresque automáticamente al seleccionar la fecha en el inputDate.
El valueChangeListener que utilizaremos es el siguiente.
También es necesario cambiar la fecha para adecuarla al formato que queramos, ya que por defecto tendríamos el siguiente formato: Tue Jul 07 00:00:00 CEST 2015
El método findComponentInRoot lo podemos encontrar en la clase JSFUtils.
Ya tenemos el valor de la fecha en el inputText:
Por último vamos a dejar bonito el componente ya que no nos interesa que el inputDate esté visible, o al menos parte del componente.
Primero añadimos un panelLabelAndMessage que englobe los 2 componentes y en ambos componentes ponemos la propiedad Simple = true. Con esto conseguimos que no se muestren las etiquetas de estos componentes.
También añadiremos un styleClass al inputDate ya que vamos a modificar el skin y en principio solo nos interesa modificar este inputDate en concreto.
Para terminar en el skin de la aplicación debemos modificar el selector af|inputDate::content para el styleClass que hemos definido en el componente. Ocultaremos la caja del componente, con lo que solo quedará visible el botón del selector.
Por último sólo nos queda ejecutar la aplicación y ver el resultado final.