1

私のフォームonSubmitは次のように呼んでいます：

onsubmit="validate(this); return false;"

validate();以下のとおりであります：

function validate(obj) {
    $.ajax({
        url : "ajax/validate_check.php",
        type : "POST",
        data : $("#" + obj.id).serialize(),
        success : function(data) {
            $('#' + obj.id + ' :input.form_errors').removeClass('form_errors')
            data = $.parseJSON(data);
            if(data['error_count'] >= 1) {
                $.each(data, function(i, item) {
                    $('#' + i).addClass('form_errors');
                });
            } else {
                $('#' + obj.id).submit();
            }
        }
    });
}

エラーが0発生すると、フォームを送信しようとしますが、無限ループが発生します。onSubmit関数を再度呼び出すため、これが発生していることに気付きました。準備ができたら、実際にフォームを送信するにはどうすればよいですか？

編集：

私はこれにアプローチするための最良の方法を探しています。ユーザーへの迅速な応答を検証onSubmitしたいので、データの行き先を知っている方法で実際にフォームを送信したいと思います（たとえば、register.phpがユーザーを登録します）。

送信するフォームがわからないため、アクションと検証を組み合わせたスクリプトを実行していないのはそのためです。私はおそらくこれを行う方法を再配置する必要があります。

4

6 に答える 6

1

削除するonsubmit="validate(this); return false;"

そして、次の関数を使用します。

$('form').submit(function(e){
    e.preventDefault();
    var $form = $(this),
        $formId = $form.attr('id'),
        $formName = $form.attr('name');

    $.ajax({
        url : "ajax/validate_check.php",
        type : "POST",
        data : $("#" + $formId).serialize(),
        success : function(data) {
            $('#' + $formId + ' :input.form_errors').removeClass('form_errors')
            data = $.parseJSON(data);
            if(data['error_count'] >= 1) {
                $.each(data, function(i, item) {
                    $('#' + i).addClass('form_errors');
                });
            } else {
                document.forms[$formName].submit();
            }
        }
    });
});

idフォームまたはname： http： //jsfiddle.net/67rvg/3/でテストできるフィドル

于 2013-03-26T01:54:08.800 に答える
0

elseブランチで別の送信を発行しませんが、真の値を返します。

onsubmitでonsubmit="return validate（this）;"を実行します

于 2013-03-23T12:28:57.363 に答える
0

あなたが言うように、送信呼び出しを使用して再度それをしないsubmitでください...あなたはループになります...送信のようにすべてを投稿するだけです：

$('#' + obj.id).submit();行を変更してsubmitForm()追加します

function submitForm() {
    var form = $("#my_form"),
        url = form.attr("action"),
        dt = form.serialize();

    $.post(url, dt, function(data) {
       // your form was post'd successfully
    });
}

作業方法がわかったので、なぜ井戸を発明するのですか？

jQuery Validateとリモート検証を使用して仕事をしてみませんか？

于 2013-03-23T12:39:54.390 に答える
0

これは機能するはずです。再送信する前に、イベントのバインドを解除してください。

それ以外の

function validate(obj) {
    $.ajax({
        url : "ajax/validate_check.php",
        type : "POST",
        data : $("#" + obj.id).serialize(),
        success : function(data) {
            $('#' + obj.id + ' :input.form_errors').removeClass('form_errors')
            data = $.parseJSON(data);
            if(data['error_count'] >= 1) {
                $.each(data, function(i, item) {
                    $('#' + i).addClass('form_errors');
                });
            } else {
                $('#' + obj.id).submit();
            }
        }
    });
}

試す

function validate(obj) {
    $.ajax({
        url : "ajax/validate_check.php",
        type : "POST",
        data : $("#" + obj.id).serialize(),
        success : function(data) {
            $('#' + obj.id + ' :input.form_errors').removeClass('form_errors')
            data = $.parseJSON(data);
            if(data['error_count'] >= 1) {
                $.each(data, function(i, item) {
                    $('#' + i).addClass('form_errors');
                });
            } else {
                $('#' + obj.id).unbind('submit').submit();
            }
        }
    });
}
于 2013-03-25T13:59:50.157 に答える
0

あなたのブロックで

   } else {
        $('#' + obj.id).submit();
   }

実際のフォーム送信を行うのではなく、別のajax呼び出しを使用して、データをフォームアクションエンドポイントに送信します。

} else {

    $.ajax({
        url : obj.action
        ,type : obj.method
        ,data : $(obj).serialize()
        ,success : function() {
            // show success message/close window/ etc
        }
        , error: function() {
            // show error saving form message
        }
    });
}

これにより、フォームの送信で問題が発生した場合に結果を取得できるようになります。

于 2013-03-25T15:41:12.390 に答える
0
  1. onsubmit属性は使用しないでください。これは、JavaScriptをhtmlマークアップに混合し、ベストプラクティスに反します。
  2. 検証を登録機能（サーバー側）の一部にしてみませんか。そうすれば、必要な2倍の往復を行う必要がなくなります。ベストプラクティスに従うと、httpリクエストをできるだけ少なくする必要があります。機能に応じて、phpスクリプトをフォルダーに整理できます。送信されているフォームを簡単に確認できます。このようにして、フォーム送信ごとに一意の検証スクリプトを作成することもはるかに簡単になります。REQUEST_URIサーバー変数を使用して、送信するフォームを確認できる場合もあります。

phpスクリプト内でリクエストのREQUESTURIにアクセスする手順については、こちらをご覧ください。

送信されたすべてのフォームに対して実行している共通の検証がある場合は、それを別のphpファイルに移動して、関数を使用するすべてのファイルにインポートできます。その関数は、インポートしたスクリプト内で使用できるようになります。

phpにファイルを含める手順については、こちらをご覧ください。

次に、個々のスクリプトにカスタム検証を追加できます。いつか、フォームの一部に対してカスタム検証が必要になる可能性が高くなります。

  • util / validation_util.php
  • ajax / user / register.php
  • ajax / user / login.php
  • ajax / user / logout.php
  • ajax / product / search.php
  • ajax / product / detail.php
  • ajax / product / addToCart.php

  • 等...

    $('#formId').on('submit', function (event) {

event.preventDefault();

$.ajax({
    url : "ajax/user/register.php",
    type : "POST",
    data : $(this).serialize(),
    success : function(data) {
        $('#' + obj.id + ' :input.form_errors').removeClass('form_errors')
        data = $.parseJSON(data);
        if(data['error_count'] >= 1) {
            $.each(data, function(i, item) {
                $('#' + i).addClass('form_errors');
            });
        }
    }
});
});
于 2013-03-26T18:20:00.757 に答える