Question

如何在ajaxToolkit CalendarExtender

中使用时禁用以前的日期

Answer 1

一个选项是在calenderextender绑定的文本框上使用rangevalidator。即如果你将日历扩展器的TargetID设置为tb1，则添加一个rangeValidator来标记tb1的内容是否在今天之前。

另一种选择是使用javascript，这是一个很好的例子： http://www.dotnetcurry.com/ShowArticle.aspx?ID=149提示6。

Answer 2

这是我对日历日期限制问题的完整解决方案：我喜欢这个解决方案的是你设置RangeValidator的MinimumValue和MaximumValue，你不必修改任何javascript。我从来没有找到一个完整的解决方案，不需要重新编译AjaxControlToolkit.dll。感谢http://www.karpach.com/ajaxtoolkit-calendar-extender-tweaks.htm让我了解如何覆盖calendar.js文件中的关键方法，而无需重新编译AjaxControlToolkit.dll。另外，我得到了“AjaxControlToolkit未定义”的javascript错误，所以我把它们改成了Sys.Extended.UI。当使用4.0版本的工具包时，它对我有用。

<%--//ADD THIS NEW STYLE TO STYLESHEET TO GRAY OUT DATES THAT AREN'T SELECTABLE--%>
<style type="text/css"> 
    .ajax__calendar_inactive  {color:#dddddd;}
</style>

在Page_Load或Init或其中，设置范围验证器的最小值和最大值：

<script runat="server">
    protected override void OnLoad(EventArgs e)
    {
        //set the validator min and max values
        this.valDateMustBeWithinMinMaxRange.MinimumValue = DateTime.Today.Date.ToShortDateString();
        this.valDateMustBeWithinMinMaxRange.MaximumValue = DateTime.MaxValue.Date.ToShortDateString();
        base.OnLoad(e);
    }
</script>

在您网页的某处添加此javascript：

<script type="text/javascript">
<%--//   ADD DATE RANGE FEATURE JAVASCRIPT TO OVERRIDE CALENDAR.JS--%>
        var minDate = new Date('<%= valDateMustBeWithinMinMaxRange.MinimumValue %>');
         var maxDate = new Date('<%= valDateMustBeWithinMinMaxRange.MaximumValue %>');
        Sys.Extended.UI.CalendarBehavior.prototype._button_onblur_original = Sys.Extended.UI.CalendarBehavior.prototype._button_onblur;
        //override the blur event so calendar doesn't close
        Sys.Extended.UI.CalendarBehavior.prototype._button_onblur = function (e) {
            if (!this._selectedDateChanging) {
                this._button_onblur_original(e);
            }
        }
        Sys.Extended.UI.CalendarBehavior.prototype._cell_onclick_original = Sys.Extended.UI.CalendarBehavior.prototype._cell_onclick;
        //override the click event
        Sys.Extended.UI.CalendarBehavior.prototype._cell_onclick = function (e) {
            var selectedDate = e.target.date;

            if (selectedDate < minDate || selectedDate > maxDate ) {
                //alert('Do nothing. You can\'t choose that date.');
                this._selectedDateChanging = false;
                return;
            }

            this._cell_onclick_original(e);
        }

        Sys.Extended.UI.CalendarBehavior.prototype._getCssClass_original = Sys.Extended.UI.CalendarBehavior.prototype._getCssClass;
        Sys.Extended.UI.CalendarBehavior.prototype._getCssClass = function (date, part) {

            var selectedDate = date;

           if (selectedDate < minDate || selectedDate > maxDate ) {
                return "ajax__calendar_inactive";
            }
            this._getCssClass_original(date, part);
        }

</script>

使用CalendarExtenter和RangeValidator将此文本框添加到您的asp.net页面：

<asp:TextBox ID="textBoxDate" runat="server" />
<ajaxToolkit:CalendarExtender ID="calendarExtender" runat="server" TargetControlID="textBoxDate" />
<asp:RangeValidator ID="valDateMustBeWithinMinMaxRange" runat="server" ControlToValidate="textBoxDate"
    ErrorMessage="The date you chose is not in accepted range" Type="Date" />
<br />
<asp:Button ID="Button1" runat="server" Text="Button" />

Answer 3

在html标记中使用Ajax工具包Calendar Extender：

<asp:TextBox ID="txtDate" runat="server" CssClass="contentfield" Height="16px" MaxLength="12" width="80px" Wrap="False"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender3" runat="server" Enabled="true" StartDate="<%# DateTime.Now %>" EndDate="<%# DateTime.Now.AddDays(1) %>" Format="dd MMM yyyy" PopupButtonID="imgDatePicker" TargetControlID="txtDate">
</asp:CalendarExtender>
<asp:ImageButton ID="imgDatePicker" runat="Server" AlternateText="Click to show calendar" Height="16px" ImageAlign="Middle" ImageUrl="~/images/Calendar_scheduleHS.png" Width="16px" />

上面你会看到日历只允许人们在今天或明天之间通过设置

进行选择

StartDate =“＆lt;％＃DateTime.Now％＆gt;”

和

EndDate =“＆lt;％＃DateTime.Now.AddDays（1）％＆gt;”

这也可以使用CalendarExtender1.StartDate = DateTime.Now;或CalendarExtender1.EndDate = DateTime.Now.AddDays(1);

在后端完成

Answer 4

只需在您的ajaxtoolkit calendarextender控件中添加属性 StartDate =“＆lt;％＃DateTime.Now％＆gt;”

Answer 5

以下链接可能对您有所帮助： Disable dates in CalendarExtender

禁用ajaxToolkit CalendarExtender中的先前日期

5 个答案: