tags:

views:

91

answers:

1

Hi there

I have a small JSF application where the user is required to enter some data about themselves. For each component on the page that has required="true" I want to show an icon depending if there is data in the field or not.

My problem is that when the page is initially shown all fields are valid, even if they do not have any data in them.

So my question is how I can set a component to be invalid based on if there is data in the field or not?

After a submit of the page (or after the component loses focus) the icon is shown properly, it is only on the initial page load I have a problem. (i.e there is no post data)

Here is my xhtml for a component that needs to be validated:

<s:decorate id="employeeIdDecoration" template="/general/util/errorStyle.xhtml">
<ui:define name="label">#{messages['userdetails.employeeId']}</ui:define>
<h:inputText value="#{authenticator.user.employeeId}" required="true">
    <a4j:support event="onblur" reRender="employeeIdDecoration" bypassUpdates="true"/>
</h:inputText>

the template:

<s:label styleClass="#{invalid?'error':''}">
        <ui:insert name="label"/>
        <s:span styleClass="required" rendered="#{required}">*</s:span>
    </s:label>
    <span class="#{invalid?'error':''}">
        <s:validateAll>
            <ui:insert/>
        </s:validateAll>
            <h:graphicImage value="/resources/redx.png" rendered="#{invalid}"
                            height="16"
                            width="16"
                            style="vertical-align:middle;"/>
            <h:graphicImage value="/resources/Checkmark.png" rendered="#{!invalid}"
                            height="16"
                            width="16"
                            style="vertical-align:middle;"/>
    </span>

Any help will be appreciated.

+1  A: 

You can:

  • on window.onload() iterate all inputs with javascript and trigger the blur event
  • on window.onload() call <a4j:jsFunction> which reRenders a parent <h:panelGroup> to all the inputs.
Bozho
Thanks BozhoI implemented a version where I use a4j:jsFunction to trigger the validation, and that works :)It would have been nice to to have the component state set without having to resort to "submitting" the panel (you can just see the state of the component change when the page is opened), but I can live with this solution.
mhylle