Question

我正在使用daterangepicker进行jquery验证。我尝试选择约会时遇到问题。当我第一次选择它时，它不显示“Hello”，但第二次显示“Hello”，我真正想要做的是在我点击下一步按钮时验证这个字段。我如何避免在我选择日期时执行“checkDate”以便在我点击下一个按钮时验证它？

在这里你可以看到我的代码：

$("#form_step1").validate({
    rules: {
        titulo: {
          required: true,
          maxlength: 300
        },
        reservationtime1:  {
          required: true,
          checkDate: true
        }
    },
    messages: {
        titulo: "At least 300 characters",
        reservationtime1: "You must pick up a valid date"
    },
    highlight: function(element) {
        $(element).closest('.form-group').addClass('has-error');
    },
    unhighlight: function(element) {
        $(element).closest('.form-group').removeClass('has-error');
    }    
});  
jQuery.validator.addMethod("checkDate", function(value, element) { 
// My custom validation
alert("Hello");
});

http://jsfiddle.net/B79z7/2/

由于

Answer 1

如果要更改输入元素的值，则表单验证将无法工作，如果要使其工作，请为daterange输入提供一些默认值。

DEMO

  <input type="text" value="Enter the date " name="reservationtime1" id="reservationtime1" 
                        class="form-control" readonly="readonly"/>

更新：对不起，我误解了这个问题，如果是这样的话，那么将#ence.click方法中的validate（）移动到#next是一个锚点，并且没有提交按钮，所以应用按钮点击表单验证方法被调用。

DEMO 2

Answer 2

尝试将onfocusout:false,添加到验证选项中。

$("#form_step1").validate({
    onfocusout:false,
    rules: {
        titulo: {
          required: true,
          maxlength: 300
        },
        reservationtime1:  {
          required: true,
          checkDate: true
        }
    },
    //....
});

这似乎仅在点击“下一步”按钮时限制对CheckDate的调用：http://jsfiddle.net/ryleyb/B79z7/7/

daterangepicker在我选择日期时触发验证

2 个答案: