没有插件的 DatePicker 开始日期和完成日期验证

Question

将 Asp.Net MVC 4 与 JqueryUI 结合使用。

我有 2 个为我提供日期选择器的文本框。我需要验证；开始日期可以等于结束日期，结束日期不能小于开始日期。

日期选择器脚本代码；

<script>
    $(function () {
        $(".date").datepicker({
            changeMonth: true,
            changeYear: true
        });
    });

</script>

我的文本框：

<td>@Html.TextBoxFor(model => model.StartDate, "{0:dd.MM.yyyy}", new { @class = "date", @id="dt1" }) </td>

<td>@Html.TextBoxFor(model => model.FinishDate, "{0:dd.MM.yyyy}", new { @class = "date", @id="dt2" }) </td>

I found this code from this subject。但我无法得到验证。我不知道有什么问题。我们将不胜感激所有帮助。

$(document).ready(function () {

$("#dt1").datepicker({
    dateFormat: "dd-M-yy",
    minDate: 0,
    onSelect: function (date) {
        var dt2 = $('#dt2');
        var startDate = $(this).datepicker('getDate');
        var minDate = $(this).datepicker('getDate');
        dt2.datepicker('setDate', minDate);
        startDate.setDate(startDate.getDate() + 30);
        //sets dt2 maxDate to the last day of 30 days window
        dt2.datepicker('option', 'maxDate', startDate);
        dt2.datepicker('option', 'minDate', minDate);
        $(this).datepicker('option', 'minDate', minDate);
    }
});
$('#dt2').datepicker({
    dateFormat: "dd-M-yy"
});

});

JQuery - end date less than start date

Answer 1

我认为这可能会对您有所帮助，当您更改其中一个日期选择器时，如果两者不同，则会显示错误。并将isValid 变量设置为 false 也阻止它提交

<script>
    var isValid=true;
    $(function () {
        $(".date").datepicker({
            changeMonth: true,
            changeYear: true,
            onSelect: function() {
                var date1 = $("#dt1").datepicker('getDate');
                var date2 = $("#dt2").datepicker('getDate');
                if (date1.getDate() === date2.getDate() && 
                    date1.getMonth() === date2.getMonth() &&
                    date1.getFullYear() === date2.getFullYear())
                {
                     isValid=false;
                     //ALERT error 
                }
            }
        });
    });

</script>