Hello, using keyboard, tabbing thru each date but I could not see the focus, how can I set the focus on each date I tab thru? I used this " RadCalendar1.SelectedDate = DateTime.Now" but it only give me the focus of the current today date. Thanks.
Protected Sub PopulateCalendar(ByVal UserID As Integer)
Dim AppointmentList As New List(Of AppointmentDTO)
AppointmentList = AppointmentManager.GetList_ByUserIDs(UserID)
Me.AppointmentCount = AppointmentList.Count
For Each appt As AppointmentDTO In AppointmentList
Dim NewDay As New RadCalendarDay(RadCalendar1)
'NewDay.Date = New DateTime(2010, 11, 12)
NewDay.Date = New DateTime(appt.StartTime.Year, appt.StartTime.Month, appt.StartTime.Day)
NewDay.IsSelected = False
NewDay.ItemStyle.CssClass = "rcSelected"
NewDay.ToolTip = "Appointment scheduled today"
RadCalendar1.SpecialDays.Add(NewDay)
Next
RadCalendar1.SelectedDate = DateTime.Now
End Sub
--
<telerik:RadCalendar ID="RadCalendar1" runat="server" TitleFormat="MMMM yyyy" Width="100%"
ShowRowHeaders="false" UseRowHeadersAsSelectors="false" UseColumnHeadersAsSelectors="false" EnableViewSelector="false">
<ClientEvents OnDateClick="Calendar_OnDateClick"></ClientEvents>
<WeekendDayStyle CssClass="rcWeekend"></WeekendDayStyle>
<CalendarTableStyle CssClass="rcMainTable"></CalendarTableStyle>
<OtherMonthDayStyle CssClass="rcOtherMonth"></OtherMonthDayStyle>
<OutOfRangeDayStyle CssClass="rcOutOfRange"></OutOfRangeDayStyle>
<DisabledDayStyle CssClass="rcDisabled"></DisabledDayStyle>
<SelectedDayStyle CssClass="rcSelected"></SelectedDayStyle>
<DayOverStyle CssClass="rcHover"></DayOverStyle>
<FastNavigationStyle CssClass="RadCalendarMonthView RadCalendarMonthView_Office2007"></FastNavigationStyle>
<ViewSelectorStyle CssClass="rcViewSel"></ViewSelectorStyle>
</telerik:RadCalendar>
5 Answers, 1 is accepted
Can you please check out this demo https://demos.telerik.com/aspnet-ajax/calendar/accessibility-and-internationalization/keyboardnavigation/defaultcs.aspx.
If it does not help, try setting the EnableMultiSelect property to true.
Regards,
Rumen
Progress Telerik
Rank 1
Hello, I tried your code either true or false on EnableKeyboardNavigation="true" EnableMultiSelect="true" or SelectionMode="Multiple" there is still no blue border or gray border focus. I'm not sure if it's the css style border but I remove them but still no focus.
<telerik:RadCalendar ID="RadCalendar1" runat="server" TitleFormat="MMMM yyyy" Width="100%"
ShowRowHeaders="false" UseRowHeadersAsSelectors="false" UseColumnHeadersAsSelectors="false" EnableViewSelector="false" EnableKeyboardNavigation="true" EnableMultiSelect="true">
Can you set the RenderMode property to Classic and test again?
Best Regards,
Rumen
Progress Telerik
Rank 1
You can tab on the header in Classic and Lightweight render mode, but the tabbing through the dates is available only in the Classic Render mode.
The navigation through the dates is possible via the arrow keys in both modes too when setting EnableKeyboardNavigation="true" and EnableMultiSelect="true".
You can increase the size of the letters in Classic render mode with the following CSS classes:
<html><head runat="server"> <title></title> <style> .RadCalendar .rcWeek th { font-size: 20px !important; } .RadCalendar_Default .rcMain .rcRow a, .RadCalendar_Default .rcMain .rcRow span { font-size: 20px !important; } .RadCalendar .rcTitlebar .rcTitle { font-size: 20px !important; } </style></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server" EnableScriptCombine="false"> </telerik:RadScriptManager> <telerik:RadCalendar ID="RadCalendar1" runat="server" TitleFormat="MMMM yyyy" Width="500px" RenderMode="Classic" ShowRowHeaders="false" UseRowHeadersAsSelectors="false" UseColumnHeadersAsSelectors="false" EnableViewSelector="false" EnableKeyboardNavigation="true" EnableMultiSelect="true"> </telerik:RadCalendar> </form></body></html>Regards,
Rumen
Progress Telerik