0

jquery検証プラグインを使用して、1つのボタンで複数のフォームを検証しようとしていますが、送信しません。ここに私のコードの簡略版があります

<script>
    $(document).ready(function() {


        var validator1 = $("#form1").validate({
            rules: {
                field1: {required: true}

            },
            messages:{
                field1:{required:"Field 1 required"},

            submitHandler: function(form) {

              //some code
                }


        });

        var validator2 = $("#form2").validate({
            rules: {
                field2: {required: true}

            },
            messages:{
                field2:{required:"Field 2 required"},

            submitHandler: function(form) {

              //some code
                }


        });

});

function submit_forms() {
    $('#form1').validate();
    $('#form2').validate();

    if ($('#form1').valid() && $('#form2').valid()) {

        alert('both forms are valid');
        //do some stuff
    }

}

</script>






<form id="form1>

<input type="text id="field1" />
</form>

<form id="form2">
<input type="text id="field2" />
</form>


<input type="button" onclick="submit_forms();" />

しかし、それは機能していません。両方のフォームが検証され、検証メッセージが表示されるようにします。どちらのフォームの送信ハンドラーも呼び出されたくありません。ボタンのクリックイベントで何をするかを決めたい。エラーがある場合は検証メッセージが表示されず、コードに問題がない場合はアラートが表示されないため、コードがまったく機能しません。

私は JavaScript プログラマーではないので、自分が何をしているのかよくわかりません。ボタンクリック関数で検証メソッドを呼び出す必要がありますか、それともドキュメントの準備ができているこのコードによって既に呼び出されていますか? $("#form1").validate(....

また、フォームをどこにも送信せず、検証メソッドと有効メソッドのみを呼び出すため、送信ハンドラーを呼び出す必要があるとは思いませんでした。これらのメソッドは舞台裏で submit() を呼び出しますか?

よろしくお願いいたします。

4

1 に答える 1