jquery树遍历将错误消息放在正确的位置

时间:2013-01-02 14:10:14

标签: jquery css dom

我正在使用找到here的时间条目小部件,并找到here的默认jquery表单验证库。我已经设置了表单验证程序,将错误消息放在表单元素后面的自定义范围中。例如:

<input type="text" id="event_title" name="event_title" class="required" size="50" maxlength="150" />
<span class="error_ctr"></span>

除了在创建窗口小部件时看起来像这样的时间条目窗口小部件之外,这样可以正常工作。

<span class="timeEntry_wrap">
   <input type="text" class="required hasTimeEntry" size="11" value="" name="start_time" id="start_time">
   </span><span class="error_ctr">
</span>

原因是因为时间条目窗口小部件将输入元素包装在span中,并且jquery验证尝试在输入元素之后找到具有error_ctr类的第一个span。这是我用来告诉验证插件在哪里放置错误消息的代码:

$(".request_form").validate({
    errorElement: "div",
    errorPlacement: function(error, element) {          
                       error.appendTo( element.nextAll(".error_ctr:first") );
                    }
});

如何告诉jquery将错误消息放在正确的位置?

2 个答案:

答案 0 :(得分:0)

这应该这样做:

error.appendTo( element.closest(".timeEntry_wrap").andSelf().next(".error_ctr") );

注意:@pimvdb的反馈后更新

答案 1 :(得分:0)

如下:

...
errorPlacement: function (error, element) {
    if (element.id == "start_time") {
        $("+ .error_ctr", element.parent()).html(error);
    } else {
        error.appendTo( element.nextAll(".error_ctr:first") );
    }
}
...