0

というフォームが#summaryformsあります。ユーザーは今すぐ予約することも、後で予約することもできます。

ここに私のボタンがあります：

<div class="bookingbuttondiv">
   <input type="hidden" name="bookingid" value="<?php echo $bookingid; ?>" />
   <input type="button" class="button" value="Book Now" onClick="this.form.action='payment.php';this.form.submit()">
   <input type="button" class="button" value="Book Later" onClick="this.form.action='poa.php';this.form.submit()"><br/><br/>
</div>

ただし、次のような jQuery Validation を使用しようとするたびに:

$("#summaryforms").validate();

それは機能せず、エラーは発生しません.2つの異なる場所に送信するオプションを維持しながら、これを回避する方法はありますか?

4

3 に答える 3

1

要素からインラインonClickハンドラを削除します。buttonインライン JavaScript の必要性を否定する jQuery を使用しています。次に、jQuery Validate プラグインには既にsubmitイベント ハンドラーが組み込まれているため、ボタンを の外に配置し、それらのイベントを個別<form></form>にキャプチャする必要があります。click

インラインonclickハンドラを削除し、id属性を追加しました。inputまた、タグを. で閉じました/>。

HTML :

<form id="summaryforms">
    ...
</form>

<div class="bookingbuttondiv">
   <input type="hidden" name="bookingid" value="<?php echo $bookingid; ?>" />
   <input type="button" class="button" value="Book Now" id="now" />
   <input type="button" class="button" value="Book Later" id="later" />
</div>

jQuery :

$(document).ready(function() {

    $('.button').each(function () {
        $(this).on('click', function () {
            var action;
            if ($(this).attr('id') == "now") {
                action = 'payment.php';
            } else {
                action = 'poa.php';
            }
            $('#summaryforms').attr('action', action).submit();
        });
    });

    $('#summaryforms').validate({ // initialize the plugin
        // any options and/or rules
    });

});

デモ: http://jsfiddle.net/a9zAh/

編集：

引用OP：

「... jQueryが呼び出される前に送信するためだと思います...」

そうすべきではありません。プラグインにはイベント リスナーが組み込まれているため、 a の呼び出しsubmit()は検証のみをトリガーする必要があります。submitOPで表示されていないコードに別の問題がある可能性があります。ルールの定義方法に問題がある可能性があります。また、あなたidはsummaryforms; なぜそれは複数形ですか？ idは一意である必要があり、 をform共有するページに複数の 、または任意の要素id="summaryforms"がある場合、問題が発生します。

上記の作業コードと jsFiddle デモをモデルとしてフォローし、行き詰まった場合は質問してください。

于 2013-03-05T16:06:36.217 に答える
-1

問題は、javascript と jQuery の両方を組み合わせることです。一般的に、javascript は jQuery よりも優先されます。これを行うと、IE などの一部のブラウザでは予期しない結果が生じます。そして、次のようにしてみてください。

編集されたスクリプト:

jQueryでは、

 $(document).ready(function(){

    $("#summaryforms").validate();

   $("#summaryforms input.button").click(function(e){
     var action = '';
     if($(e.target).val() === 'Book Now'){
       action = 'payment.php';
     }else if($(e.target).val() === 'Book Later'){
       action = 'poa.php';
     }
     $("#summaryforms").attr('action', action);
     $("#summaryforms").submit();
   })

  });

HTMLでは、

<div class="bookingbuttondiv">
   <input type="hidden" name="bookingid" value="<?php echo $bookingid; ?>" />
   <input name="booknw" type="button" class="button" value="Book Now" >
   <input name="booklater" type="button" class="button" value="Book Later" ><br/><br/>
</div>
于 2013-03-05T15:39:45.557 に答える
-1

絶対。通常の送信を「キャプチャ」し、それが起こらないようにしてから、検証を行います。

フォームの送信を停止するには、ID があることを確認し (そうしているように見えます)、次のようなものを使用します。

// on DOM load...
jQuery(function () { 
    // attach a handler to the SUBMIT of your form
    jQuery('#summaryforms').submit( function () {
       // do validation or whatever, and if it passes, return true
       // to submit
       if (myFormIsValid) {
           return true;
       }
       // otherwise, prevent it from submitting "normally"
       return false;
    });
});
于 2013-03-05T15:17:17.100 に答える