如何在涉及组时定位jQuery验证消息?

时间:2012-07-18 01:19:11

标签: jquery jquery-plugins validation

我有一个表单,我在其元素上使用jQuery验证。表单包含两个文本字段和一组复选框。我的代码的相关部分如下所示:

$.validator.addMethod('require-one', function (value) {
    return $('.require-one:checked').size() > 0;
}, 'Who should see your question?');

var checkboxes = $('.require-one');
var checkbox_names = $.map(checkboxes, function(e,i) { return $(e).attr('name')}).join(' ');

$('FORM#node-form').validate({
    groups: { checks: checkbox_names },
    errorPlacement: function(error, element)
    {
        if (element.attr('type') == 'checkbox') {
            error.insertAfter('#user_role_buttons > div > label');
        }
        else {
            error.insertAfter(element);
        }
    }
});

新方法和“复选框”内容是复选框作为一个组处理所必需的,并且它实际上正常工作,包括在#user_role_buttons事物中放置错误消息。

我的问题/问题是我找不到任何方法来为两个文本元素设置错误消息的位置。验证对这些项目正常工作;我只是不能指明他们的立场。特别是,涉及这些项的错误没有出现在validate处理程序的errorPlacement子句中:如果我在errorPlacement的函数中放入一个console.log(element)语句来查看正在发生的事情,那么唯一显示的是涉及复选框的错误(假设有一个)。文本项的消息被放置在半合理的地方,但不是我想要的地方。

我必须遗漏一些东西;任何人都可以看到它是什么?

1 个答案:

答案 0 :(得分:0)

好吧,我不确定这是否“正确”,但我有一些工作。我在这一点上的信念是,一旦你为“群体”定义了某些东西,你必须定义你想要作为一个群体验证的所有东西,即使它只是一件事。所以上面代码的工作版本如下所示:

$.validator.addMethod('require-one', function (value) 
                                                { return $('.require-one:checked').length > 0; }, 
                                                'Who should see your question?'
                              );
var checkboxes = $('.require-one');
var checkbox_names = $.map(checkboxes, function(e,i) { return $(e).attr('name')}).join(' ');
$('FORM#node-form').validate({
                        groups: { 
                            checks: checkbox_names,
                            title: 'title',
                            body: 'body',
                            },
                        errorPlacement: function(error, element) {
                                 if (element.attr('type') == 'checkbox') {
                                    error.insertAfter('#user_role_buttons > div > label');
                                 }
                                 else if (element.attr('type') == 'text') {
                                    error.insertAfter('#edit-title-wrapper > label');
                                 }
                                 else if (element.attr('name') == 'body') {
                                    error.insertAfter('#edit-body-wrapper > label');
                                 }
                        }         
            });

也就是说,我将“title”和“body”定义为组,每个组都指向该字段的“名称”。这些然后出现在errorPlacement处理程序的调用中,我可以测试它们的存在并按照我想要的方式分配定位。不是我所期望的那样,但我认为事后才有意义......