Richfaces - Get Element By Id

Question

We are using Richfaces in one of our projects.

I need to focus the element dynamically on some user action. The issue here is I only have the id (JSF specific id that I give to element.)

For example: for h:inputText I use it as

<h:inputText id="userNameInputBox" value="<<some binding>>/>

and this input box is embedded in separate form. When I include the input box in form, the id of the input box will be: formName:userNameInputBox (<<formName>>:<<elementId>>)

I will be re-using the input box in multiple JSPs. That means, I do not know the parent form in which I will include the input box.

Now, I need to focus() the input box. Currently I am not able to do this as I do not have the actual generated id (<<formname>>:<<elementId>>) but I only have the JSF specific id I gave.

How can I make focusing the element work?

Answer 1

Use the RichFaces tag function #{rich:clientId( JSF_ID )} to get the appropriate client id for a component. If you need the element inside the DOM tree, you can get it directly with #{rich:element( JSF_ID )}

Example: onclick="#{rich:element('userNameInputBox')}.focus()"

I believe you need RichFaces 3.2.0 or higher for this to work.

The documentation on Richfaces JS Interaction functions