funcionalidad Desactivación commandButton si la validación falla o inputText llamada AJAX comienza

Question

tengo el siguiente fragmento de código dentro de un formulario:

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

Así que los mensajes de validación funcionan bien en el elemento inputText. Pero el botón de enviar sigue haciendo una solicitud de Ajax cuando se hace clic, aunque la entrada no sea válida. Quiero que se envíe la solicitud de Ajax si el texto de entrada es válido.

Cómo lo hago?

Además; hay otro caso que me gustaría desactivar el botón. Este es el caso donde inputText se valida y el usuario hace clic en el botón. La razón de esto es que no quiero que el usuario inunde las solicitudes por error. (es decir, presione repetidamente el botón Enviar)

Actualmente, la función de Javascript handleOnclick solo muestra un cuadro de diálogo modal que dice "esperar". Como ese diálogo es modal, el fondo es inaccesible. Sin embargo, eso no impide que el usuario lo presione repetidamente porque transcurre 1 segundo entre el clic y el diálogo modal que se muestra. Además; este enfoque no evita la presentación de datos no válidos. ¿Qué puedes sugerir?

Uso JSF2.0 y Primefaces 3.0.

Cualquier ayuda apreciada.

Answer 1

Puede usar el atributo disabled del botón para ello. Sólo tienes que configurar a true siempre FacesContext#isPostback() vuelve false (así, es una solicitud inicial), o cuando es true (así, se someten ha producido un formulario), a continuación, comprobar si FacesContext#isValidationFailed() vuelve true (por lo que la validación ha fallado en general).

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

Sólo es necesario para asegurar que actualice el botón de peticiones Ajax, así, por lo que volverá a aparecer ya sea activado o desactivado cuando sea necesario.

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