Отключить предыдущие даты в ajaxToolkit CalendarExtender - PullRequest
9 голосов
/ 04 мая 2009

Как отключить предыдущие даты при использовании в ajaxToolkit CalendarExtender

Ответы [ 5 ]

4 голосов
/ 14 июня 2011

Вот мое полное решение проблемы ограничения календарной даты: что мне нравится в этом решении, так это то, что вы устанавливаете MinimumValue и MaximumValue для RangeValidator, и вам не нужно изменять какой-либо javascript. Я никогда не находил полного решения, которое не требовало бы перекомпиляции AjaxControlToolkit.dll. Спасибо http://www.karpach.com/ajaxtoolkit-calendar-extender-tweaks.htm за предоставленную мне идею о том, как переопределить ключевые методы в файле calendar.js без перекомпиляции AjaxControlToolkit.dll. Кроме того, я получил ошибки javascript «AjaxControlToolkit is undefined», поэтому я изменил их на 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>

Добавьте это текстовое поле на страницу asp.net с CalendarExtenter и RangeValidator:

<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" />
4 голосов
/ 19 августа 2009

Один из вариантов - использовать Rangevalidator в текстовом поле, с которым связан calenderextender. Т.е. если у вас есть TargetID расширителя календаря, установленного на tb1, добавьте rangeValidator, чтобы пометить, когда содержимое tb1 ранее, чем сегодня.

Другой вариант - использование JavaScript, и вот хороший пример: http://www.dotnetcurry.com/ShowArticle.aspx?ID=149 СОВЕТ 6.

1 голос
/ 08 августа 2012

Использование Ajax Toolkit Calendar Extender в разметке html:

<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 = "<% # DateTime.Now%>"

и

EndDate = "<% # DateTime.Now.AddDays (1)%>"

Это также можно сделать в бэкэнде, используя CalendarExtender1.StartDate = DateTime.Now; или CalendarExtender1.EndDate = DateTime.Now.AddDays(1);

0 голосов
/ 01 сентября 2015

Просто добавьте атрибут StartDate = "<% # DateTime.Now%>" в вашем элементе управления ajaxtoolkit calendarextender

0 голосов
/ 06 ноября 2009

Следующая ссылка может вам помочь: Отключить даты в CalendarExtender

...