jsf-2 - h：commandButtonを介した条件付き送信

Question

プロジェクトではJSF2.0を使用しています。Mojaraとは別に、一部のコンポーネントにはPrimefaces3.3を使用しています。プロジェクトには、（クライアント側の検証の一部として）Javascript検証を実行する必要があるという要件があり、フォームの送信のみが行われる必要があります。JSFによって行われる検証は、とにかく（サーバー側で）行われます。しかし、Javascriptの検証もそこにあるはずです。

これが私がこの質問をした理由ですが、コメントはありませんでした。

したがって、私はJavaScript検証を実装しており、これにより、私が直面している実際の問題が発生します。「必須」フィールド、長さチェックなどの基本的な検証を実行し、適切なタイミングでそれらを呼び出すJS関数があります（onblurなど）。ただし、ユーザーがすべてのフィールドを空のままにするか、一部のフィールドにまったく入力せず（したがって、onblurなどのイベントをトリガーしない）、送信ボタンをクリックすると、これらのフィールドはJS検証で失われます。では、すべてのJS検証が完了した後、条件付きでフォームを送信するにはどうすればよいですか？フォームの送信にはf：ajaxを使用する必要があることに注意してください。

フォームのonsubmit関数を試しました。FFでは動作しますが、IE9では動作しません。コマンドボタンのonclick機能を試してみました。jsを呼び出しますが、フォームも送信します。

それが役立つ場合はいくつかのコード

私が使用しているJavaScript関数

     var validationErrorFound = false;


     function validateRequired(element,form){

if(null == element.value || "" == element.value){
    var existingClass = element.getAttribute("class");
    var newClass = existingClass + " inputError";
    element.setAttribute("class", newClass); 

    var label = document.getElementById(element.getAttribute("id") + "Lbl");
    var labelArray = new Array();
    var temp = label.innerText;
    labelArray = temp.split(":");
    element.setAttribute("title", labelArray[0] + " is Required");
    validationErrorFound = true;
}else{
    element.className = element.className.replace( /(?:^|\s)inputError(?!\S)/ , '' );
    element.setAttribute("title", null);
    element.removeAttribute("title");
    validationErrorFound = false;
}   
    }



     function validateAllRequired(form){
var all = document.getElementsByTagName("input"); 
var max=all.length; 
for (var i=0; i < max; i++) {       
     if(null != all[i].onblur ){
        validateRequired(all[i],form);      
     }

}
return validationErrorFound;

     }

JSFページ

     <h:form id="addUserDetailsForm">   
<h:messages/>           



        <h:panelGrid columns="2">
            <p:outputLabel id="userNameLbl" for="userName" value="Username:" />
            <p:inputText id="userName" required="true" onblur="validateRequired(this,this.form);"
                value="#{userList.addUser.userName}">
                <f:param name="req" value="true"/>
            </p:inputText>  
            <p:outputPanel value="" />

            <p:outputLabel id="firstNameLbl" for="firstName" value="First Name:" />
            <p:inputText id="firstName" required="true" onblur="validateRequired(this,this.form);"
                value="#{userList.addUser.firstName}"/>

            <p:outputLabel id="lastNameLbl" for="lastName" value="Last Name:" />
            <p:inputText id="lastName" required="true" onblur="validateRequired(this,this.form);"
                value="#{userList.addUser.lastName}"/>


            <h:commandButton styleClass="button" value="Add" onclick="validateAllRequired(this.form);"                                      
                    action="#{userList.dummyAdd}" >
                 <f:ajax execute="@form" render=":mainArea :propertiesArea" update=":mainArea :propertiesArea"/>                                        
            </h:commandButton>  

        </h:panelGrid>

これを行う方法はありますか？

ありがとう