条件 Jquery 验证

Question

我有一个页面，主要功能是在数据库中添加新记录。在给出一个条件后，页面工作正常。需要添加的字段之一是日期字段。该页面有一个年份日期的下拉列表（2017,2018.2019）。例如，当下拉列表中选择的年份为 2017 年时，所有输入的日期应为 2017 年以内的日期。输入的日期小于或大于 2017 年的日期不应被验证且不被接受。当 dropdwon 中选择的年份是 2018 或 2019 时，情况相同。接受的输入应与下拉列表中的所选年份相同。

我最初使用 Jquery validate 进行验证。（我只是在验证中显示日期部分）

这是下拉菜单的 html

<div class="col-sm-2" id="y_type" style="text-align:left;">
<select class="" style="width: 100%; display:inline-block;">
    @{ 
         DateTime datetime = DateTime.Now;
         for (int i = 0; i <= 2; i++)
      {
           <option>@(datetime.AddYears(+i).ToString("yyyy"))</option>
       }
     }
</select>
 </div>

另一方面，

holiday_date 在文本字段的 ID 中 ，

这是 jquery 之前进行验证的部分

 $("form").validate({
        rules:
            { 
                "holiday_date[]": {
                    required: true
                    },
                },
            },


        errorClass: "invalid",
        errorPlacement: function (error, element) {
            $('#ResultDialog p').html("@hmis_resources.Message.msg_80005");
            $('#ResultDialog').modal();
        },
        submitHandler: function (form) {
            ajaxFormSubmit();
        }
    });

我最初做的是创建一个函数来测试或比较日期的文本字段和下拉列表的值。但这也不起作用。我不确定它的位置

 function testdate() {

        $(".holidayBody tr").each(function (key, value) {

            var holiday_date = $(value).find(".holiday_date").val();
            if (typeof holiday_date !== 'undefined') {
                var year = holiday_date.substr(6, 4);
                var month = holiday_date.substr(3, 2);
                var days = holiday_date.substr(0, 2)
                holiday_date = year + '/' + month + '/' + days;

                var dropdownear =  $('#y_type :selected').text();
                var result = year == dropdownear;
                alert(result)
            }

        })
    }

如果有更简单的方法来完成这个，如果你能分享，我将不胜感激。

Answer 1

您应该为验证器添加一个自定义方法，就像这样 fiddle:
Validating year from select input.

<script>
  $(document).ready(function() {

    var $select = $("select");

     //I added only the year to the drop down, you should change it to full date.
    for (var i = 0; i < 3; i++) { 
      var year = new Date();
      year.setFullYear(year.getFullYear() + i);
      $select.append("<option value=" + year.getFullYear() + " >" + year.getFullYear() + " </option>");
    }

    // add the rule here
    $.validator.addMethod("thisYearOnly", function(value, element, arg) {

      var selectedYear = value;
      var currentDate = new Date();
      var currentYear = currentDate.getFullYear();

      return currentYear == selectedYear;

    }, "Must select this year");

    // configure your validation
    $("form").validate({
      rules: {
        mydate: {
          thisYearOnly: true
        }
      }
    });


  });
</script>

条件 Jquery 验证

Condition on Jquery Validate

javascript

jquery

jquery-validate