JQuery验证组成功消息

嗨，我很新的验证插件。我试图验证三个dropboxes，出生日期字段，问题是每个字段发生变化后弹出成功消息，而不管其他两个字段是否已填写。JQuery验证组成功消息

$(document).ready(function() { 
    $("#subscribe").validate({ 
     success: function(em) { 
      em.html("<img src='/Themes/ChefAndBrewer/content/images/tick.png' />").addClass("valid"); 
     }, 
     rules: { 
      day: { 
       required: true 
      }, 
      month: { 
       required: true 
      }, 
      year: { 
       required: true 
      } 
     }, 
     groups: { 
      DateofBirth: "day month year" 
     }, 
     errorPlacement: function(error, element) { 
      if (element.attr("name") == "day" || element.attr("name") == "month" || element.attr("name") == "year") error.insertAfter("#year"); 
      else error.insertAfter(element); 
     } 
    }); 
}); 

<li class="full-width"> 
<select class="required " id="month" name="month"><option value="">Month...</li> 
<li class="full-width"> 
<select class="required day" id="day" name="day"><option value="">Day...</li> 
<li class="full-width"> 
<select class="required" id="year" name="year"><option value="">Year...</li>

来源

2012-03-13 Chris

你想要什么行为？只有在用户点击提交按钮时才能进行验证？或者只显示三次下拉菜单的验证消息一次？ – arb 2012-03-13 15:10:14

我希望在输入完所有三个字段后出现错误/成功消息 – Chris 2012-03-13 15:13:06

当用户输入数据的时候没有“好”的方法来输入数据，除非他们点击屏幕上的其他东西来提醒你他们完成输入数据。您如何知道何时输入了三个字段？如果用户选择一个，然后改变他们的想法并将其设置为空白然后去喝一杯咖啡会怎么样？ – arb 2012-03-13 15:19:25

他们需要Validating broken up date width jQuery Validation plugin

<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
<script src="jquery.validate.js" type="text/javascript"></script> 
</head> 
<body> 
<form id="form" name="form"> 
<select name="day" id="day"> 
    <option value="">DD</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select> 
<select name="month" id="month"> 
    <option value="">MM</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select> 
<select name="year" id="year"> 
    <option value="">YYYY</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select> 
<input type="submit" id="sub"/> 
</form> 

<script> 
$(function() { 


    // this function requires month day and year selections 
    $.validator.addMethod("FullDate", function() { 


    //if all values are selected 
    if($("#day").val() != "" && $("#month").val() != "" && $("#year").val() != "") { 
     return true; 
    } else { 
     return false; 
    } 
    }, 'errrr'); 



    $("form").validate({ 

    success: function(em) {  
         em.html("winner").addClass("valid"); 
       }, 

    rules: { 
     day: "FullDate", 
     month: "FullDate", 
     year: "FullDate" 
    }, 
    groups:{ 
     dateofbirth:"day month year" 
    }, 
    errorPlacement:function(error,element){ 
     error.insertAfter('#sub'); 
    } 
    });  
}); 
</script>

来源

2012-03-15 10:40:22 Chris

的validater的group选项仅用于分组消息，规则不是集合。对于您现在指定的组，只会为您的所有三个select对象打印一个“必需”消息。

我的建议是去除group，让每个选择与它自己所需要的消息，可以与.validate()

的messages选项覆盖我也想从选择删除的CSS类required，因为我敢肯定您正在通过基于这个答案做

rules: { 
    day: { required: true }, 
    month: { required: true }, 
    year: { required: true } 
}

来源

2012-03-13 15:33:33 arb

回答

相关问题