1

jsfで構築されたフォームでjQuery検証プラグインを使用してクライアント検証を行おうとしています。明らかな理由で、サーバーとブラウザー間の要求/応答のラウンドトリップの数を減らすために、基本的にクライアント検証が必要です。jsfの「h：commandlink」タグは、以下のコードを使用してJQueryフォームの検証で正常に機能するようになった「h：commandButton」のように、通常の送信ボタンとは異なります。

    <script type = "text/javascript">

        $(document).ready(function(){

            $("#form").validate({
                rules: {
                    "form:staffno": {
                        required: true


                    }        
                }
            });


        });
    </script>

                    <h:body>
                    <h:form id="form">
                    <h:inputText id="staffno"  value="#" required="true"/>
                    <h:commandButton id="save" value="SAVE" action="#"/> //renders a html submit button type
                    </h:form>
                    </body>

ページソースから、h：commandLinkが何らかのjavascript関数を使用していることに気付いたので、上記を微調整して、以下に示すのと同じ効果を得ようとしました。

                  <script type="text/javascript">

                    $(document).ready(function(){
                        $("#form").validate({
                            rules: {
                                "form:staffno": {
                                    required: true


                                }        
                            }
                        });

                        $("#form\\:save").click(function(){ 
                            if($("#form").valid()){
                               //cannot use regular $("#form").submitt()
                               // really can't figure what to use here
                            }
                            else{
                                return false;
                            }

                        });       


                    });  
                </script>

微調整を行うと、JQuery検証プラグインの動作を取得できましたが、フィールドが空の場合でもフォームが送信されるため、しばらくの間しか実行できませんでした。2つのonclicksがjqueryで呼び出され、もう1つがjsfで呼び出されると思ったようなものですが、それを正しく行う方法がまだわかりません。このクライアント検証をJQueryとjsfh：commandLinkで正しく機能させるには助けが必要です。ありがとう

4

2 に答える 2

0

trueフォームが有効な場合にのみ戻ります。機能を直接委任することもできvalid()ます。

$("#form\\:save").click(function(){ 
    return $("#form").valid();
});

を実際に使用することはできません$("#form").submit()。この方法では、コマンド ボタンの HTML 表現の name=value ペアが<input type="submit">要求パラメーターとして送信されず、JSF が呼び出す必要があるコマンド ボタン アクションを識別できないためです。 .

于 2012-09-06T11:50:14.413 に答える
-1 
<script type="text/javascript">
$(document).ready(function(){
   $("#form").validate({
      rules: {
         "form:staffno": {
            required: true
         }        
      }
   });
   $("#form\\:save").click(function(){ 
      return $("#form").valid();
   });
</script>
<body>
   <h:form id="form">
   <h:inputText id="staffno"  value="#" required="true"/>
   <!-- renders a html submit button type -->
   <h:commandButton id="save" value="SAVE" action="#"/> 
   </h:form>
</body>

スクリプトを .xhtml ファイルで使用すると、スクリプトが正しく動作しません .......................... ................................................... タグに「type」属性がある場合、「text/javascript」または「application/javascript」と等しくなければなりません。また、スクリプトは解析可能 (構文的に正しい) でなければなりません。

于 2014-08-23T08:51:03.150 に答える