对 parsley min 检查错误消息的特殊效果，Rails 4

Question

我正在创建带有注册的简单应用程序，它包含多种字段类型 - 字符串、文本、复选框等。

我添加了parsley 以显示错误（如果有）。这很好用。 但是现在我想在发生错误时更改标题的颜色 - 特别是当 parsley-min-check 触发它时。

我的代码：

<div class="col-lg-3"> 
    Services
    <hr>          
  <div class="services-heading">  (Minimum*3)  </div>

    <div class="services-reg">

     <% @services.each do |service| %>
       <li>

            <%= check_box_tag 'service_ids[]', service.id, false, :'data-parsley-mincheck'=>3,:required => true%>
         <%= h service.name%>                       
       </li>               


     <% end %>
   </div>

 </div>

现在我正在尝试在所需的 div (services-reg) 包含欧芹错误消息时触发脚本。

 $(document).ready(function() {
    if ( $( ".services-reg  > li.parsley-error").length ) {

        $(".services-heading > p").css("color", "red");
    }   
 });

但有些事情没有按预期工作。 控制台不显示任何错误消息。

提前感谢您的宝贵时间。

Answer 1

您正在检查.services-reg 是否在您的文档上准备好了li.parsley-error。此时，您尚未执行任何验证。

您可能可以利用Parsley's events，例如parsley:form:error。因此，您可以收听该事件，该事件在出现验证错误时触发。

$(document).ready(function() {
    // when there's a validation error
    $.listen('parsley:form:error', function(ParsleyForm) {
        $(".services-heading > p").css("color", "red");
    });
});

检查此jsfiddle demo，当正确验证表单时，我还使用parsley:form:success 去除红色。

---

更新：如果您有包含几个字段的 div 组，并且您想要更改正确 div 的颜色，您可以使用事件 parsley:field:error 和 parsley:field:success。 p>

例子：

$.listen('parsley:field:error', function(ParsleyField) {
    var pElement = ParsleyField.$element.parent('div').prev().find('p');
    pElement.css("color", "red");
});

在这里，我根据 jQuery 元素为有错误的输入找到正确的 div。您可能需要根据表单的 DOM 进行调整。

看看这个working jsfiddle。