2010-11-10 1 views
6

Un molto semplice Applicaton JSF:JSF h: validazione inputText ef: ajax rendono

  • elemento InputText viene assegnata Validator.
  • f: ajax viene utilizzato per il rendering dell'elemento successivo (phoneNumber) utilizzando l'evento blur.
  • PhoneNumber verrà visualizzato solo se inputText passare il validatore e valore booleano isValid è impostato a true

Ecco il frammento di codice

<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; 
} 

Il problema è , per qualche ragione, phoneNumber non è reso affatto.

L'unico modo che posso farlo funzionare è modificando f: ajax rendere @form

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

o rimuovere reso da phoneNumber

rendered="#{person.isValid}" 

Per qualche ragione f: ajax con particolare ID elemento e rendering basati su Attributo managedBean non possono coesistere.

Qualche idea o consiglio ragazzi?

NOTA: questo comportamento accadere anche quando uso ascoltatore invece di validatore

risposta

7

Il f:ajax funziona al lato client. L'elemento specificato in render deve essere già presente nell'albero HTML DOM lato client. Inseriscilo ad esempio a h:panelGroup, che viene sempre visualizzato sul lato client.

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