Cuando trabajamos con JSF tenemos que tener cuidado con los ids que asignamos a cada componente, dado que estos deben ser únicos.
JSF y otras librerías, para prevenir problemas en este sentido, siguen las siguientes reglas:
- Cuando no se asigna un id de manera explícita a un elemento se le genera un client id único.
- A todos los client ids (autogenerados o fijos) le antepone los client ids de los componentes padres, por ejemplo un inputText que se encuentre dentro de un form tendría un client id de la siguiente forma: nombreForm:nombreInputText.
- Componentes como a4j:repeat van incluso más alla, generando client ids con esta estructura nombreForm:nombreRepeat:indice:componente.
Antes de la última versión de rich faces (http://www.jboss.org/jbossrichfaces/downloads/) teníamos el problema de tener que estar pendientes de los client id, por ejemplo para obtener un elemento teníamos que escribir algo como esto:
document.getElementById(“formName:elementName”)
Sin embargo rich proporciona ahora 4 métodos muy interesantes para obtener referencias a los componentes desde javascript:
- rich:clientId(‘id’) retorna el client id compuesto del componente JSF
- rich:element(‘id’) es una contracción de document.getElementById(#{rich:clientId(‘id’)})
- rich:component(‘id’) es una contracción de #{rich:clientId(‘id’)}.component
- rich:findComponent(‘id’) devuelve una instancia de UIComponent tomando el id como parámetro.
Veamos un ejemplo:
<script>
function getLinkAndDoClick() {
#{rich:element('linkid')} .onclick();
}
</script>
<h:form>
<a4j:commandLink id=”linkid” value=”Haz click aqui” action=”#{somebean.someAction()}”/>
</h:form>De esta manera se puede obtener referencias a los componentes JSF sin tener que estar preocupándose cómo sus client id son generados.
