Question

我在后端有一个函数来验证任何给定的表单，但是，我正在使用这个函数，并且它在表单提交无效时工作正常，但是如果表单有效，我的后端会返回一个字符串＆＃39;有效＆＃39;我应该让表格恢复POST ACTION

这是代码：

＆＃13;

    $('form.ajaxpost').submit(function(event) {
        var valid = true;
        event.preventDefault();

        var form = $(this);
        var sbmtBtn = form.find('input[type=submit]');
        var sbmtBtnTxt = sbmtBtn.val();
        sbmtBtn.val('Validating ...').attr('disabled', 'disabled');

        $.post("/application/index/validate-form", form.serialize() + '&formname=' + form.attr('name'), function(data) {
            if (data != 'valid') {
                valid = false;
                $('body').find('script').append(data);
                $('html, body').animate({scrollTop: $(".has-error:first").offset().top}, 800);
                sbmtBtn.val(sbmtBtnTxt).attr('disabled', null);
                return false;
            }
            form.trigger('submit');
        })
    });

＆＃13;

当它返回有效时＆＃39;表单触发＆＃39;提交＆＃39;一次又一次地永远:(

Answer 1

您的代码没有终止条件。因此，提交按钮会一次又一次地触发。

假设您要在验证后仅提交一次。将您的代码更改为此。

var called_once = false; // identifier

$('form.ajaxpost').submit(function(event) {
    var valid = true;
    event.preventDefault();

    var form = $(this);
    var sbmtBtn = form.find('input[type=submit]');
    var sbmtBtnTxt = sbmtBtn.val();
    sbmtBtn.val('Validating ...').attr('disabled', 'disabled');

    $.post("/application/index/validate-form", form.serialize() + '&formname=' + form.attr('name'), function(data) {
        if (data != 'valid') {
            valid = false;
            $('body').find('script').append(data);
            $('html, body').animate({scrollTop: $(".has-error:first").offset().top}, 800);
            sbmtBtn.val(sbmtBtnTxt).attr('disabled', null);
            return false;
        }

        // triggering submit only when it is not called previously
        if (called_once === false) {
            form.trigger('submit');
            called_once = true;
        }
    })
});

希望这能解决问题...

Answer 2

似乎没有办法阻止默认事件并再次重新提交表单。所以它的工作方式是在验证后通过AJAX发布表单，而不是默认提交已被阻止:) 这是工作代码

＆＃13;

    $('form.ajaxpost').submit(function(event) {
        event.preventDefault();

        var form = $(this);
        var sbmtBtn = form.find('input[type=submit]');
        var sbmtBtnTxt = sbmtBtn.val();
        sbmtBtn.val('Validating ...').attr('disabled', 'disabled');

        $.post("/application/index/validate-form", form.serialize() + '&formname=' + form.attr('name'), function(data) {
            if (data != 'valid') {
                $('body').find('script').append(data);
                $('html, body').animate({scrollTop: $(".has-error:first").offset().top}, 800);
                sbmtBtn.val(sbmtBtnTxt).attr('disabled', null);
                return false;
            } else {
                $.post(form.attr('action'), form.serialize());
                window.location = form.attr('action');
            }
        })
    });

＆＃13;

提交时的AJAX表单验证

2 个答案: