Как контролировать стиль сегодняшней ячейки в asp.net ajax CalendarExtender?

На основе API AjaxControlToolkit для CalendarExtender я могу управлять стиль выбранной даты с использованием:

.ajax__calendar_active { background-color:red }

И в соответствии с API я надеялся, что .ajax__calendar_today позволит мне управлять стилем сегодняшней ячейки таблицы, если показать. К сожалению, этот .ajax__calendar_today управляет стилем большей кнопки «Сегодня: XYZ» в нижней части календаря.

Кто-нибудь знает, как стилизовать сегодняшнюю ячейку таблицы, если/когда отображается?

Обновление:

Я проверил HTML с помощью Firebug и увидел, что для ячейки сегодняшнего дня нет специального класса css или другого индикатора. Я думаю, это имеет смысл с точки зрения сервера... как узнать, какой сегодня день на компьютере пользователя, без добавления кода для захвата смещения по Гринвичу и тому подобного.

Итак, знайте, я думаю, что я застрял, создавая некоторый javascript, чтобы получить сегодняшнюю клиентскую сторону даты и сравнить с атрибутом заголовка каждой ячейки, который установлен на что-то вроде «Пятница, 11 февраля 2011 г.».

Обновление: сентябрь 2011 г. В последнем выпуске AjaxControlToolkit для управления этим добавлен класс CSS .ajax__calendar_today.


calendarextender
person slolife    schedule 25.02.2010    source источник

Ответы (4)


arrow_upward
1
arrow_downward

Я считаю, что вы могли бы использовать следующий класс CSS:

.ajax__calendar_today .ajax__calendar_day {цвет фона: красный;}

person Brad    schedule 04.10.2011
comment
Да, похоже, что выпуск AjaxControlToolkit за сентябрь 2011 года добавил класс css ajax__calendar_today к сегодняшней дате. Очень круто! - person slolife; 05.10.2011

arrow_upward
0
arrow_downward

Не удалось найти для этого специальный класс, поэтому я добавил стиль в свой site.master. К вашему сведению, заполнение 0 связано с тем, что граница занимает 2 пикселя, для чего установлено заполнение по умолчанию.

<style type="text/css">
    div.ajax__calendar_day[title='<%=DateTime.Now.ToString("dddd, MMMM dd, yyyy")%>']
    {
    border: 1px solid #F00;
    padding-right: 0px;
    }
</style>
person Lodlaiden    schedule 09.08.2013

arrow_upward
0
arrow_downward

Лучшее решение, которое я нашел, — это этот пост.

Я просто удалил первые 2 строки функции (установить текущий день) и исправил ошибку опечатки в dayDIVs[i].style.borderccolor to dayDIVs[i].style.borderC цвет (заглавная C для цвета). Вы также можете добавить dayDIVs[i].style.borderStyle = dotted;

Итак, вот его расшифровка (с моими изменениями):

/* In HEAD section */

<script type="text/javascript">
    function clientShown(sender, args) {
        var today = new Date();
        var currentTitle = today.localeFormat("D");
        //Find all the Day DIVs in the Calendar's daysBody
        var dayDIVs = sender._daysBody.getElementsByTagName("DIV");
        for (i = 0; i < dayDIVs.length; i++) {
            if (dayDIVs[i].title == currentTitle) {
                //Change the current day's style
                dayDIVs[i].style.borderColor = "#0066cc";
                dayDIVs[i].style.borderStyle = "dotted";
            }
        }
    }
</script>

/* and then in your BODY: */

<cc1:CalendarExtender ID="CE" runat="server" Enabled="True" TargetControlID="CalendarDateTextBox"
                        OnClientShown="clientShown" />
person Matt Roy    schedule 25.09.2020

arrow_upward
-1
arrow_downward

Вам понадобится следующий класс css: .ajax_calendar .ajax_calendar_active .ajax__calendar_day {background-color:red;}

person reckface    schedule 13.10.2010
comment
Кажется, это перед выбранной ячейкой дня, а не сегодняшняя дата. - person slolife; 11.02.2011