Hi,
I have a simple form with a text input and a select box. I validate the text input with <a4j:support> triggered by an onblur event rendering an error message.
The following scenario causes the problem:
When a user first edits the text input field and then opens the select box below, the onblur event of the text input fires and causes an error message to render next to the text input. Very nice so far. But the problem in Firefox is that the expanded select box loses focus, "collapses" and the user has to click once again to expand it. This does not occur in IE.
<h:form id="editForm"> <s:decorate id="idInput" template="../validationDecorator.xhtml" > <ui:define name="label">#{messages['edit.refData.id.label']}</ui:define> <h:inputText id="idInputField" value="#{refData.id}" required="true" > <a4j:support event="onblur" reRender="idInput" ajaxSingle="true" bypassUpdates="true" /> </h:inputText> </s:decorate> <s:decorate id="enabledInput" template="../validationDecorator.xhtml" > <ui:define name="label">#{messages['edit.refData.enabled.label']}</ui:define> <h:selectOneMenu value="#{refData.enabled}"> <s:selectItems value="#{constants.listValuesEnabled}" var="status" label="#{messages[status]}" /> </h:selectOneMenu> </s:decorate> <h:commandButton id="save" action="#{editAction.save(refData)}" value="#{messages['edit.save']}"/> </h:form>