2

我有一个输入，就像<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'
    }
})

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

但是当我拿起日期时间时，错误提示仍然没有消失。我想让它消失。

谁能给我一个建议？

4

3 回答 3

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 对话框不会隐藏。此外，错误消息仅在日期字段失去焦点后才消失 - 这与其他字段不一致。这对我有用。

我希望这可以帮助别人。这似乎运作良好 - 至少对我来说;)

于 2012-12-13T01:56:21.590 回答
1

您可以使用focusCleanup摆脱任何错误类和消息。

$(".selector").validate({
   focusCleanup: true
})
于 2012-04-12T09:57:42.063 回答
1

当时这里的解决方案对我不起作用。当从日期选择器中选择日期时，添加下面的 onSelect 以验证日期字段的工作是什么：

$("#dateFieldID").datepick({
    dateFormat: 'dd/mm/yyyy',
    changeMonth: true,
    changeYear: true,
    maxDate: 0,
    onSelect: function () {
        $("#dateFieldID").valid();
    }
});
于 2018-08-28T00:15:54.553 回答