2010-11-10 14 views
6

A JSF très simple applicaton:JSF h: validation de inputText et f: Ajax rendent

  • élément InputText est associé avec validateur.
  • f: ajax est utilisé pour rendre l'élément suivant (phoneNumber) en utilisant l'événement blur.
  • PhoneNumber ne sera affiché que si inputText passe le validateur et la valeur booléenne isValid est à true

Voici l'extrait de code

<h:form id="invOrdersWizForm">         
    <h:inputText id="name" maxlength="9" styleClass="ordLabelNarrow" 
     validator="#{person.validatePerson}"         
     value="#{person.name}"> 
     <f:ajax render="phoneLabel" event="blur"/>                
    </h:inputText> 
    <h:outputText id="phoneLabel" 
     rendered="#{person.isValid}"       
     styleClass="ordLabelWide" value="#{person.phoneNumber}" /> 
</h:form> 

ManagedBean

public void validatePerson(FacesContext context, UIComponent toValidate, Object value) { 
    name = ((String) value).toUpperCase(); 
    phoneNumber = "12345678"; 
    isValid = true; 
} 

Le problème est , pour une raison quelconque, le numéro de téléphone n'est pas rendu du tout.

La seule façon que je peux le faire fonctionner est en changeant f: ajax rendre @form

<h:inputText id="name" maxlength="9" styleClass="ordLabelNarrow" 
    validator="#{person.validateSecurityCode}"        
    value="#{person.name}"> 
    <f:ajax render="@form" event="blur"/>                
</h:inputText> 

ou supprimer rendu de phoneNumber

rendered="#{person.isValid}" 

Pour une raison f: ajax avec spécifique ID de l'élément et rendu basé sur l'attribut managedBean ne peut pas coexister.

Une idée ou un conseil les gars?

REMARQUE: ce comportement se produit aussi quand je l'utilise auditeur au lieu de validateur

Répondre

7

Le f:ajax fonctionne à côté client. L'élément spécifié dans render doit déjà être présent dans l'arborescence DOM HTML côté client. Mettez par exemple un h:panelGroup qui est toujours rendu au client.

<h:panelGroup id="phoneLabel"> 
    <h:outputText rendered="#{person.isValid}" value="#{person.phoneNumber}" /> 
</h:panelGroup>