Introducción
La gestión de eventos de teclado dentro de una aplicación web es un tema interesante y que se debe aplicar siempre para controlar la interacción con el usuario en diferentes ámbitos.
El framework RichFaces ha diseñado un componente para la captura de este tipo de eventos y su aplicación dentro de aplicaciones web es simple y muy limpia.
Componente hotkey
Los eventos de teclado se gestionan mediante el componente hotkey:
<rich:hotkey ...=""></rich:hotkey>
Sus atributos son:
- key: cadena de caracteres que identifica a la tecla o combinación de teclas. Por ejemplo “ctrl+up”, “a”, “return”, etc.
- handler: define la función callback asociada.
- selector: selector JQuery que define cuáles son los elementos sobre los que se aplica el handler. Por defecto, su valor es html[0].
Capturando eventos de teclado
Ejemplo: se diseña una página JSF donde existe un botón que lanza una petición ajax específica. Se desea que si el usuario pulsa Enter también desencadene la misma operación.
<rich:hotkey handler="buscar();" key="return">
</rich:hotkey>
La función JavaScript buscar se ejecuta cuando el usuario pulsa enter. Para terminar se pasa a definir la función buscar de tal manera que desencadene la petición Ajax en servidor que necesitamos:
<a4j:form>
...
<a4j:jsfunction action="#{buscarFichero.buscar}" name="buscar" rerender="resultados,scroll01">
</a4j:jsfunction>
</a4j:form>