javascript - 无法使用 JQuery 表单插件进行简单验证来提交表单

Question

我正在使用 jQuery Form 插件来提交 AJAX 请求。我正在尝试在提交之前进行一些简单的验证(确保填写字段)。我不会在提交之前尝试运行任何 AJAX 验证。在我将 beforeSubmit 添加到 ajaxform() 方法的选项之前，表单将提交并且我的 Controller 代码将正常运行。一旦我添加了带有验证函数名称的 beforeSubmit 选项，无论我从 validate 方法返回 false、true 还是什么都不返回，表单都不会提交。这是我设置表单的初始代码:

$(document).ready(function() {
var options = {
    beforeSubmit: function(data, form, options) { return validate(data, form, options); },
    url: '/PromoManagement/Images/AddImages?partial=true',
    success: updateImageList
};

    $('#frmAddImages').ajaxForm(options);
});

这是我的验证函数:

function validate(data, form, options) {
    var returnMessage = new Array();

    $('#txtImagePath,#txtImageCaption').removeClass('validationError-input');
    clearValidation();

    if ($('#txtImagePath').val().length == 0) {
        returnMessage.push('<li>Image Path is required</li>');
        $('#txtImagePath').addClass('validationError-input');
    }
    else { 
        if (!parseFileExtension($('#txtImagePath').val())) {
            returnMessage.push('<li>Please provide an image with an extension of .jpg, .gif, or .png</li>');
            $('#txtImagePath').addClass('validationError-input');    
        }    
    }

    if (returnMessage.length > 0) {
        $('.errorList').show();
    }

    if (returnMessage.length != 0) {
        buildValidationList(returnMessage);
        return false;
    }
    else {
        return true;
    }

}

如果没有遇到错误，我尝试不返回任何内容，但得到相同的结果。我能够闯入验证代码并查看函数返回的内容，这始终符合预期。我在这里错过了什么吗？

Answer 1

我认为 beforeSubmit 没有将表单传递给验证函数。尝试将 validate 包装在匿名函数中并提供正确的表单参数。

编辑 看起来 beforeSubmit 函数采用三个参数 ( API )，其中第二个参数是表单。我已经更新了我的示例以反射(reflect)这一点。查看您的代码后，看来您无论如何都没有使用它 - 所以这也已更新。我不确定到底发生了什么，因为它看起来应该有效。您是否确认验证函数中没有出现任何 JavaScript 错误？

beforeSubmit: function(data,form,options) {
    return validate();
}