Question

我有一个像<input name="begin_time" />,<input name="end_time" />这样的输入我正在使用jquery.datepicker和jquery-ui-timepicker-addon.js来获取日期时间。

$('input[name=begin_time]').datetimepicker({
        minDate : 0,
        stepMinute : 5,
        beforeShow : function (input, inst) {},
        onClose : function (dateText, inst) {
            var endDateTextBox = $('input[name=end_time]');
            var beginDateTextBox = $('input[name=begin_time]');
            var testStartDate = new Date(dateText);
            if (endDateTextBox.val() != '') {
                var testEndDate = new Date(endDateTextBox.val());
                if (testStartDate > testEndDate)
                    endDateTextBox.val(dateText);
            } else {
                endDateTextBox.val(dateText);
            }
        },
        onSelect : function (selectedDateTime) {
            var start = $(this).datetimepicker('getDate');
            $('input[name=end_time]').datetimepicker('option', 'minDate', new Date(start.getTime()));
        }
    });
    $('input[name=end_time]').datetimepicker({
        onClose : function (dateText, inst) {
            var startDateTextBox = $('input[name=begin_time]');
            if (startDateTextBox.val() != '') {
                var testStartDate = new Date(startDateTextBox.val());
                var testEndDate = new Date(dateText);
                if (testStartDate > testEndDate)
                    startDateTextBox.val(dateText);
            } else {
                startDateTextBox.val(dateText);
            }
        },
        stepMinute : 5,
        onSelect : function (selectedDateTime) {
            var end = $(this).datetimepicker('getDate');
            $('input[name=begin_time]').datetimepicker('option', 'maxDate', new Date(end.getTime()));
        }
    });

我也使用jquery.validate.js验证输入，并确保在提交表单之前需要它。

$('#form').validate({
    rules : {
        begin_time : 'required',
                end_time : 'required'
    },
    messages : {
        begin_time : 'The  start time can\' be empty',
                end_time : 'The event end time can\' be empty'
    }
})

当用户没有填写任何内容时，我提交，然后出现该消息（它是正确的）。

但是当我提取日期时间时，错误提示仍然不会消失。我希望它消失。

有人可以给我一个建议吗？

Answer 1

您可以使用focusCleanup删除任何错误类和消息。

$(".selector").validate({
   focusCleanup: true
})

Answer 2

这对我有用：

$("#dateFieldID").change(function () {
    $('#formID').validate({
        required: true,
        date: true
    }).element('#dateFieldID');
});

在每个日期选择器输入字段中添加更改事件，然后验证为我删除了该字段。我在Firefox 17，IE 7 +，Safari 6和Chrome v.23中进行了测试。我已经看到其他帖子，开发人员建议挂钩到JQuery UI DatePicker onClose事件，然后在调度onClose事件时将焦点设置回日期字段。这确实工作，但是在IE中，DatePicker对话框不会隐藏。此外，错误消息仅在日期字段失去焦点后消失 - 这与其他字段不一致。这对我有用。

我希望这有助于某人。这看起来效果很好 - 至少对我来说;）

Answer 3

当时的解决方案对我不起作用。当从日期选择器中选择一个日期时，所做的工作是添加以下onSelect来验证日期字段：

$("#dateFieldID").datepick({
    dateFormat: 'dd/mm/yyyy',
    changeMonth: true,
    changeYear: true,
    maxDate: 0,
    onSelect: function () {
        $("#dateFieldID").valid();
    }
});

如何在jquery.datepicker之后删除错误提示

3 个答案: