Question

我在ASP Classic页面中有以下三个输入框，每个输入框都与相应的jquery datepicker日历相关联：

<br />
Start Date: <input type="text" id="dtpDateStart" name="dtpDateStart" />
<br />
<br />
End Date:   <input type="text" id="dtpDateEnd" name="dtpDateEnd" />
<br />
<br />
Return By:  <input type="text" id="dtpDateReturn" name="dtpDateReturn" />
<br />

和JQuery脚本：

<script type="text/javascript">
$(function () {
    $("#dtpDateStart").datepicker({
        beforeShowDay: $.datepicker.noWeekends,
        changeMonth: true,
        changeYear: true,
        dateFormat: 'm/d/yy',
        onClose: function (selectedDate) {
            $("#dtpDateEnd").datepicker("option", "minDate", selectedDate);
        }
    });
    $("#dtpDateEnd").datepicker({
        beforeShowDay: $.datepicker.noWeekends,
        changeMonth: true,
        changeYear: true,
        dateFormat: 'm/d/yy',
        onClose: function (selectedDate) {
            $("#dtpDateStart").datepicker("option", "maxDate", selectedDate);
            $("#dtpDateReturn").datepicker("option", "minDate", selectedDate);
        }
    });
    $("#dtpDateReturn").datepicker({
        beforeShowDay: $.datepicker.noWeekends,
        changeMonth: true,
        changeYear: true,
        dateFormat: 'm/d/yy',
        onClose: function (selectedDate) {
            $("#dtpDateEnd").datepicker("option", "maxDate", selectedDate);
        }
    });

});

在开始日期日历（dtpDateStart）中选择日期时，结束日期（dtpDateEnd）日历将仅允许显示开始日期之后的日期。等等返回日期日历（dtpDateReturn）。

但我现在需要再添加两个功能项：

在页面加载时，将今天的日期填入“开始”和“结束”输入字段，并将明细日期显示在ReturnBy输入字段中。
如果StartDate已更改，则自动将EndDate和ReturnByDate字段更新为同一日期（或+1），如果它们中已有的日期在StartDate之前（否则如果它们在StartDate之后则保留）

我的第一个项目在一个简单的日历中工作，其中包含以下内容：

$("#jqDatePicker").datepicker("setDate", new Date);

但似乎无法将其推入上述功能。

有什么建议吗？

Answer 1

不确定回答我自己的问题而不是编辑它的礼节，但在这里我最终做了什么。根据@jesus.tesh建议，我通过服务器端将值（即今天的日期）添加到页面加载的输入字段中，例如。

<% 
  Dim todaysDate 
  todaysDate = Date()
%>

<input type="text" id="dtpDateEnd" name="dtpDateEnd" value="<%=todaysDate%>" />

我还改变了上面的javascript / jQuery以更好地满足我的需求：

<script type="text/javascript">

$(function () {
    $("#dtpDateReturn").datepicker({ beforeShowDay: $.datepicker.noWeekends, dateFormat: 'm/d/yy', changeMonth: true, changeYear: true });
    $("#dtpDateReturn").datepicker("setDate", +1);
});

$(function () {
    $("#dtpDateStart").datepicker({
        beforeShowDay: $.datepicker.noWeekends,
        changeMonth: true,
        changeYear: true,
        dateFormat: 'm/d/yy',
        onClose: function (selectedDate) {
            $("#dtpDateEnd").datepicker("option", "minDate", selectedDate);
        }
    });
    $("#dtpDateEnd").datepicker({
        beforeShowDay: $.datepicker.noWeekends,
        changeMonth: true,
        changeYear: true,
        dateFormat: 'm/d/yy',
        onClose: function (selectedReturnDate) {
            $("#dtpDateReturn").datepicker("option", "minDate", selectedReturnDate);
        }
    });

    $("#dtpDateReturn").datepicker( {});
});

它几乎可以满足我的需要

jquery Datepicker - 填充页面加载时的输入字段

1 个答案: