JQuery Validate Groups Успешное сообщение - PullRequest
Новая
       7

JQuery Validate Groups Успешное сообщение

2 голосов
/ 13 марта 2012

Привет, я довольно новичок в плагине проверки. Я пытаюсь проверить три дропбокса, поля даты рождения, проблема в том, что сообщение об успехе появляется после изменения каждого поля независимо от того, были ли заполнены два других поля или нет. 

$(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>

Ответы [ 2 ]

3 голосов
/ 15 марта 2012

На основе этого ответа Проверка ширины разбитой даты jQuery Плагин проверки 

<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>
1 голос
/ 13 марта 2012

Параметр валидатора group используется только для группировки сообщений, а не для сбора правил. В указанной вами группе будет напечатан только один «обязательный» обмен сообщениями для всех трех ваших select объектов.

Мое предложение состоит в том, чтобы удалить group, и каждый из них должен выбрать свое собственное обязательное сообщение, которое можно переопределить с помощью опции messages, равной .validate()

Я бы также удалил класс CSS required из выбора, потому что я почти уверен, что вы делаете их обязательными, выполняя 

rules: {
    day: { required: true },
    month: { required: true },
    year: { required: true }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...