<h:form target=“_blank” only after validation

Question

I want a form that after submitting and validating opens a new tab with the results. I used the <h:form target="_blank" method to get the new tab, but it shows the validation errors in the new tab. I want it to only open the new tab if the validation is passed.

My guess is the only real cross browser solution would be to do some SJAX validation onsubmit, but I'm not sure if there are any libraries that will do this for me.

So, is there a way to validate and open a new window only if validation passes?

Answer 1

Since you haven't provided any code sample I assume you are using a <h:form> and a <h:commandButton> within it.

If so, you have to do a simple trick to overcome this issue. You have to use a <a4j:commandButton> instead of your <h:commandButton> and keep the <h:commandButton> hidden. Then use the oncomplete event of the <a4j:commandButton> to determine whether to click the <h:commandButton> .

The <h:commandButton is clicked by javascript, only if validations are passed.

<h:form target="_blank">
  <h:inputText value="" required="true" id="txt"/>
  <rich:message for="txt"/>
  <a4j:commandButton value="Submit" action="#{bean.someMethod()}"           
    oncomplete="if(#{!(facesContext.maximumSeverity.ordinal ge 2)}){
    #{rich:element('btn')}.click();}"/>
  <h:commandButton value="temp" id="btn" style="display:none;"/>
</h:form>

Answer 2

If you can invoke the validation using JavaScript using some AJAX behavior , you may be able to do it easily by using an onSubmit event function as below:

   function fnSubmit(){
     var validated= performValidation();
     if(validated){
         document.getElementById('formName').target="_blank";
         document.getElementById('formaName').submit();
     }
   }

Answer 3

I've been inpired by this thread to found a solution for my problem. So I decided to post mine, too. I had the requirement to stay on the same site if an error occured and if not to open a new tab with a page for printing.

<h:form target="#{printBean.isErrorHappened() ? '_self' : '_blank'}"
     id="formPrintSearchResult">
     <h:commandLink id="cmdLinkPrintSearchResult"
          value="Print overview"
          onmouseover="#{rich:element('checkForErrors')}.click();"
          action="#{printController.printSearch()}" />
      <a4j:commandLink id="checkForErrors" style="display:none;" 
          render="formPrintSearchResult" />
</h:form>   

If you like you could include another action on the a4j:commandLink to check for errors and set the errorHappened in the printBean.