jquery日期范围：如果未选择日期，则输入文本框值更改为null答案

【问题标题】：jquery date range: input text box value is changed to null if date is not selectedjquery日期范围：如果未选择日期，则输入文本框值更改为null
【发布时间】：2013-01-22 04:39:31
【问题描述】：

我在两个输入框中启用了 jquery 日期范围选择器来选择开始日期和结束日期，默认值为 startDateInput=Start Date 和 endDateInput=End Date。但是当单击开始输入框并选择开始日期时，写入 endDateInput 的值等于结束日期将变为空。我正在使用的脚本如下：

startDate(选择开始日期的输入框名称) endDate(选择结束日期的输入框名称)

$(function () {
    $("#startDate").datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        minDate: new Date(2012, 11 - 1, 27),
        maxDate: -1,
        onClose: function (selectedDate) {
            $("#endDate").datepicker("option", "minDate", selectedDate);
        }
    });
    $("#endDate").datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        minDate: new Date(2012, 11 - 1, 28),
        maxDate: -1,
        onClose: function (selectedDate) {
            $("#startDate").datepicker("option", "maxDate", selectedDate);
        }
    });
});

【问题讨论】：

标签： jquery asp.net jquery-ui c#-4.0 jquery-ui-datepicker

【解决方案1】：

将selectedDate 转换为Date 对象，然后再分配给onClose 函数中的datepicker。

如下修改你的代码。

$(function () {
    $("#startDate").datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        minDate: new Date(2012, 11 - 1, 27),
        maxDate: -1,
        onClose: function (selectedDate) {
            $("#endDate").datepicker("option", "minDate",new Date(selectedDate));
        }
    });
    $("#endDate").datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1,
        minDate: new Date(2012, 11 - 1, 28),
        maxDate: -1,
        onClose: function (selectedDate) {
            $("#startDate").datepicker("option", "maxDate", new Date(selectedDate));
        }
    });
});

参考：检查Demo

【讨论】：

感谢您的及时回复！！ but i have a text value in my input boxes Start Date and End Date, when start Date is selected, text value in endDate input box is set to null

【解决方案2】：

如果你说的是水印，那么你可以试试这个：

$(function () {
        $("#startDate").datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 1,
            minDate: new Date(2012, 11 - 1, 27),
            maxDate: -1,
            onClose: function (selectedDate) {
                if ($("#endDate").val() != 'End Date') {
                    $("#endDate").datepicker("setDate", selectedDate);
                }
            }
        });
        $("#endDate").datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 1,
            minDate: new Date(2012, 11 - 1, 28),
            maxDate: -1,
            onClose: function (selectedDate) {
                if ($("startDate").val() != 'Start Date') {
                    $("#startDate").datepicker("setDate", selectedDate);
                }
            }
        });
    });

【讨论】：

这就是我所需要的！！非常感谢

【解决方案3】：

日期设置的方式不正确。

替换：

$("#endDate").datepicker("option", "minDate", selectedDate);

与：

 $("#endDate").datepicker("setDate", selectedDate);

并替换：

$("#startDate").datepicker("option", "maxDate", selectedDate);

与：

$("#startDate").datepicker("setDate", selectedDate);

我希望它会有所帮助。

【讨论】：