funzionalità Disattivazione commandButton se la convalida inputText fallisce o chiamata AJAX inizia

Question

ho il seguente pezzo di codice all'interno di un modulo:

<p:panel id="panel" header="lalalala"> 
    <h:panelGrid columns="5"> 

     <h:outputLabel value="Enter name" for="name" /> 

     <p:inputText id="name" value="#{userBean.name}" 
      required="true" label="name" maxlength="15" 
      validatorMessage="oops" 
      requiredMessage="ooopps"> 
      <f:validateRegex 
       pattern="^somepattern$"> 
      </f:validateRegex> 
      <p:ajax event="blur" update="inputValidationMessage" /> 
     </p:inputText> 

     <p:message id="inputValidationMessage" showSummary="false" 
      for="name" /> 
     <p:watermark for="name" value="eg. John" /> 

    </h:panelGrid> 

    <p:commandButton id="submitButton" value="Submit" update="panel" 
     actionListener="#{userBean.save}" 
     onclick="handleOnclick" 
     oncomplete="handleAjaxResponse(xhr, status, args)"> 
    </p:commandButton> 
    <p:messages autoUpdate="true" globalOnly="true" showDetail="true" /> 
</p:panel> 

Così i messaggi di validazione funzionano bene sull'elemento inputText. Ma il pulsante di invio esegue ancora una richiesta Ajax quando viene fatto clic, anche se l'input non è valido. Voglio che la richiesta Ajax venga inviata se l'inputText è valido.

Come faccio?

Inoltre; c'è un altro caso che mi piacerebbe disattivare il pulsante. Questo è il caso in cui inputText viene convalidato e l'utente fa clic sul pulsante. La ragione di questo è, non voglio che l'utente invada erroneamente richieste. (premere ripetutamente il pulsante di invio)

Attualmente, la funzione javascript handleOnclick mostra solo una finestra di dialogo modale che dice "aspetta". Poiché quella finestra di dialogo è modale, lo sfondo non è accessibile. Tuttavia, ciò non impedisce ancora all'utente di premerlo ripetutamente perché passa 1 secondo tra la visualizzazione di dialogo onclick e modale. Inoltre; questo approccio non impedisce l'invio di dati non validi. Cosa puoi suggerire?

Uso JSF2.0 e Primefaces 3.0.

Qualsiasi aiuto apprezzato.

Answer 1

È possibile utilizzare l'attributo disabled del pulsante per questo. Basta impostare per true ogni volta FacesContext#isPostback() rendimenti false (così, si tratta di una richiesta iniziale), o quando è true (così, invia si è verificato un modulo), quindi verificare se FacesContext#isValidationFailed() rendimenti true (così la convalida non è riuscita in generale).

<p:commandButton ... disabled="#{not facesContext.postback or facesContext.validationFailed}" /> 

Hai solo bisogno di assicurarsi di aggiornare il pulsante richieste Ajax e, in modo che riapparirà abilitato o disabilitato in caso di necessità.

<p:ajax event="blur" update="inputValidationMessage submitButton" />