web-dev-qa-db-ja.com

jQuery ValidateプラグインのsubmitHandler関数でフォームが送信されないようにする

http://docs.jquery.com/Plugins/Validation/validate の検証プラグインでjQueryを使用しています

フォームの検証と送信プロセスがajax経由で実行された後、フォームが送信されないようにします。私は次のコードを持っています：

$("#myform").validate({
   rules: {...},
   submitHandler: function(form) { 
      alert("Do some stuff...");
      //submit via ajax
      return false;  //This doesn't prevent the form from submitting.
   }
});

ただし、これに関する問題は、処理関数の最後の行にreturn false;ステートメントがあるにもかかわらず、submitHandlerがフォームを送信することです。すでにajaxを介して送信しているため、デフォルトの動作を防ぎ、フォームの送信を停止したいです。

submitHandler関数のajaxコードを通過した後、コードの送信を停止するにはどうすればよいですか？

javascriptjqueryvalidation
29
Carven

私はこれを次のように行いますが、あなたが望むように正確に機能します：

$("#myform").submit(function(e) {
    e.preventDefault();
}).validate({
    rules: {...},
    submitHandler: function(form) { 
        alert("Do some stuff...");
        //submit via ajax
        return false;  //This doesn't prevent the form from submitting.
    }
});
50
Zoltan
$("#myform").validate({
   rules: {...},
   submitHandler: function(form, event) { 
      event.preventDefault();
      alert("Do some stuff...");
      //submit via ajax
   }
});

この助けを願っています。

30
pockiiie

送信ボタンを使用せずに外部で検証できる場合があります。

if($("#myform").valid()){
    alert("Do some stuff...");
}
2
pilavust

「jQuery Walidate」を使用して、これを非常に簡単な方法でコーディングできます。 http://jquery.dop-trois.org/walidate/

ここで、送信時に実行される関数をコーディングできます。ドキュメントでコールバックを探します。

1
Gregory

submitイベントでevent.preventDefault()を呼び出すことができます：

$("#myform").on("submit", function(event) {
    event.preventDefault();
});
1
VisioN

残念ながら、呼び出しsubmitHandler: function(form){はイベント引数を受け取らないため、唯一の解決策はreturn false次のようなステートメント：

...
submitHandler: function(form) {
    //your code
    return false;
},
...
0
Miquel Adell

働く フィドル

jqueryプラグイン検証ドキュメントによると。

submitHandler（デフォルト：ネイティブフォーム送信）

以下のsubmitHandlerによる送信メソッドは documentation から引用されていますが、動作するはずですが、実際には動作しません

フォームが有効なときに実際の送信を処理するためのコールバック。 formとsubmit eventを唯一の引数として取得します。デフォルトの送信を置き換えます。検証後にフォームをAjax経由で送信する適切な場所。

例：有効な場合、jQuery Formプラグインを使用して、Ajax経由でフォームを送信します。

$("#myform").validate({   
   submitHandler: function(form,event) {
     event.preventDefault();
      $(form).ajaxSubmit();   
   } 
});

私はここでコードを書いています。単にvalidayionプラグインを呼び出し、検証関数の引数にsubmitHandlerを含めないでください。

submitHandlerで送信および防止する代わりに、フォーム送信のjQueryメソッドを使用します。以下のような

$("form").validate({});

$(document).on("submit", "form", function (event) {
   event.preventDefault();
   alert("submit"); 
});
0
Waqar Hussain

この方法で修正しました。 v1.19.0でも修正されないjQuery Validation Pluginバグのパッチ

$('#save_edit_user').on('click', function () {
    var isValid = $("#edit_user").validate().form() && $("#edit_user").validate().element("#edit_user_email");
    //check current ajax call by $.active 
    //the form is not submitted before 0 ajax is running
    if (isValid && $.active == 0){
     // my save logic

    }
});
0
Adrian P.