0

在以下帖子的帮助下，我使用 JQuery 和 Unobtrusive 验证实现了一些自定义验证逻辑：

在文本框上手动设置不显眼的验证错误

为了节省您阅读该帖子的时间，这里有一个简单的 javascript，如果出现故障，它会强制显示验证消息：

在我的文本框中.blur():

var errorArray = {};
errorArray["Slug"] = 'Some error message for the Slug text box';
$('#SomeFormId').validate().showErrors(errorArray);

效果很好。

我的问题是显示失败的验证消息时，单击提交时表单提交就好了。

如何使用上面的代码实现自定义验证并防止在显示消息时提交表单？我厌倦了做类似的事情，$('#SomeFormId').valid = false;但它没有用。

谢谢你。

4

2 回答 2

2

使用$('#SomeFormId')将不起作用，因为当您这样做时：

$('#SomeFormId').valid = false;

然后当您submit再次使用（我假设的）在表单处理程序中访问它时：

var form = $('#SomeFormId');   // or $(this)
if (form.valid) {
    //
}

您实际上是在创建两个不同的对象，即使它们指的是同一个 DOM 元素。所以设置valid = true一个不会在第二个更新它。

您提供的代码非常简单，所以我假设您的验证与您的submit处理程序是分开的（因为它blur无论如何都是），所以您可以做的是使用类似.data()或标志的东西（只要确保它在上下文中） .

// on blur
$('#SomeFormId').data('isvalid', false);    // invalid

// on submit
var isvalid = $('#SomeFormId').data('isvalid');
if (!isvalid) {
    // invalid form
    ev.preventDefault();
}

编辑

jQuery 事件对象

当您在 jQuery 中将函数绑定为事件处理程序时，jQuery 默默为您做的一件事就是它为您“创建”了一个规范化的 Event 对象。这将包含有关您可以在处理程序中使用的事件的信息，并且还允许您以某些方式控制事件的行为。

// setting a submit event on my form
//                                       |   whatever you put here 
//                                       V   is the event object.
$('#SomeFormId').on('submit', function (ev) {

    // preventing the default action
    // : in a form, this prevents the submit
    ev.preventDefault();
});
于 2012-10-02T18:31:14.123 回答
1

要检查表单是否有效，您可以使用以下内容：

var form = $("#SomeFormId");
form.submit(function(event) {
    if(form.valid() == false) event.preventDefault();
}

编辑以添加更多内容，这将处理您的提交/预防，现在您只需添加验证调用。

于 2012-10-02T18:27:51.580 回答