How do I retrieve a JSF component value by using EL?

Question

Before going on, see this question

It's JSF form is shown again as follows:

<f:view>
    <h:form>
        <div>
            <label>Id</label>
            <input type="text" name="accountId"/>
        </div>
        <div>
            <label>Amount</label>
            <input type="text" name="amount"/>
        </div>
        <h:commandButton value="Withdraw" action="#{accountService.withdraw(param.accountId, param.amount)}"/>
    </h:form>
</f:view>

Notice that I have used <input type="text" name="amount"> instead of <h:inputText id="amount">. In order to retrieve its value by using Seam EL resolver, I use param.amount.

It happens that if I use <input type="text" and something goes wrong on server side, I need to show the page again. So its submitted value is not retrieved because it is a plain html code. Because of that, I need to use a <h:inputText JSF component instead.

So the question is: How do I retrieve a <h:inputText JSF component value by using Expression Language?

Answer 1

The JSF client ID's are prepended by the cliend ID of parent UINamingContainer components (e.g. h:form, h:dataTable, f:subview). If you check the generated HTML source in your webbrowser (rightclick, view source), then you should see them. The id and name of the generated input elements are prepended with the id of the parent form. You need to use the same name as key in the parameter map. As the separator character, the colon :, is an "illegal" character in EL, you need to use the brace notation param['foo:bar'] to retrieve them.

<f:view>
    <h:form id="account">
        <div>
            <label>Id</label>
            <h:inputText id="id" />
        </div>
        <div>
            <label>Amount</label>
            <h:inputText id="amount" />
        </div>
        <h:commandButton value="Withdraw" 
            action="#{accountService.withdraw(param['account:id'], param['account:amount'])}"/>
    </h:form>
</f:view>

Without Seam-EL-like method parameters (you apparently don't want/have it), you can also access them in the request parameter map using the client ID's as keys:

public void withDraw() {
    Map<String, String> map = FacesContext.getCurrentInstance().getRequestParameterMap();
    String id = map.get("account:id");
    String amount = map.get("account:amount");
    // ...
}

Needless to say that this is nasty. Just do it the normal JSF way, bind the values with bean properties.

Edit: as per the final question which you have edited:

So the question is: how do i retrieve a <h:inputText JSF component value by using Expression Language ?

This is already answered before. Use the JSF-generated name as parameter name. This is usually in the pattern of formId:inputId where formId is the id of the parent UIForm component and the inputId is the id of the UIInput component. Check the generated HTML output for the exact name of the generated <input type="text"> field. To obtain the parameter value, use the brace notation ['name'], because you cannot use the colon : in EL as in ${param.formId:inputId}.

Thus:

#{param['formId:inputId']}