0

我有一组日期范围控件：

<div id="CustomDateRow" class="row-fluid" runat="server">
    <label class="span2 FieldLabel">
        Start Date:
    </label>
    <asp:TextBox ID="StartDate" CssClass="datepicker span3" runat="server" ClientIDMode="Static"></asp:TextBox>
    <label class="span2 FieldLabel">
        End Date:
    </label>
    <asp:TextBox ID="EndDate" CssClass="datepicker span3" runat="server" ClientIDMode="Static"></asp:TextBox>
</div>

我正在将这些控件转换为 jQuery UI 日期选择器。

我需要确保用户在任何给定时间都不能选择超过 30 天。最初我计划设置maxDate时EndDate设置StartDate，但是有两个基本问题。

  1. JavaScript 中没有很好的DateTime.AddMonths()类似函数。
  2. 这篇SO 文章让我意识到它对用户的友好程度确实要低得多。

所以，我想我将只使用 aRangeValidator并在每次值更改时验证两个日期之间的天数。

所以，我有一个RangeValidator这样的：

<div class="row-fluid">
    <asp:RangeValidator ID="DateRangeValidator" runat="server" ControlToValidate="DateRange"
        ErrorMessage="The date range must be at least one day and not more than thirty."
        EnableClientScript="true" MinimumValue="1" MaximumValue="30" CssClass="errortext span9 offset2"
        Display="Dynamic" />
</div>

它正在验证一个基本的文本输入控件：

<asp:TextBox ID="DateRange" runat="server" ClientIDMode="Static" />

日期更改时在 JavaScript 中更新：

$('.datepicker').change(function () {
    var nDifference = Math.abs(new Date($('#StartDate').val()) - new Date($('#EndDate').val()));
    var one_day = 1000 * 60 * 60 * 24;
    $('#DateRange').val(Math.round(nDifference / one_day));
});

问题

即使当我通过 jQuery 设置它时值确实发生了变化，它RangeValidator也没有反应。但是，如果我在文本输入中键入值并使其RangeValidator按预期工作。

我是否需要在控件上触发某种事件DateRange以强制RangeValidator执行？

4

1 回答 1

1

好吧，我最终做了两件非常简单的事情来解决这个问题，它们都驻留在 JavaScript 方法中来计算范围。这是工作代码。

$('.datepicker').change(function () {
    var nDifference = new Date($('#EndDate').val()) - new Date($('#StartDate').val());
    var one_day = 1000 * 60 * 60 * 24;
    $('#DateRange').val(Math.round(nDifference / one_day));
    Page_ClientValidate(null);
});

请注意，我摆脱Math.abs了nDifference计算，因为我需要真正的差异，无论是正面的还是负面的。最后，请注意我添加了行Page_ClientValidate(null);，这就是RangeValidator我设置验证的原因。

完美运行！

于 2012-11-21T19:32:29.860 回答