Test Environment:
OS: Windows_11Repro Steps:
6. Observe an issue that 'Month' control on 'Calendar' popup is not accessible using keyboard.
'Click to book' and header controls are not accessible using keyboard.
1. Open URL: SMB Scheduler (agentcalendardevone.azurewebsites.net) page in Edge Browser.
2. Provide valid 'Email address' in text field and activate 'Book New Appointment'.
3. Select any 'Time Zone' in dropdown and click 'View Available appointments' button.
4. Navigate to the table content.
5. Observe the issue that the controls in the table such as ("<", ">", "Today", calendar widget, "Week", "Click to the book") does not receive keyboard focus.
Actual Behavior:
'Month' Control on 'Calendar' popup is not accessible using keyboard.
Expected Behavior:
Control(s) must be accessible to Bluetooth keyboards and other assistive technology. Common causes of this problem include a) the element does not have a proper role assigned, b) the element needs tab-index="0" attribute to be focusable, or c) the component is not registering key presses.
RadCalendar and RadDatePicker cannot pass the following check by https://achecker.ca/checker/index.php WCAG 2.0 guideline Section 1.3 Adaptable: Create content that can be presented in different ways (for example simpler layout) without losing information or structure. Success Criteria 1.3.1 Info and Relationships (A) Check 245: Data table with more than one row/column of headers does not use id and headers attributes to identify cells. Repair: Add id and headers attributes to table cells so they identify the cells that relate to the headers. Error Line 597, Column 8: <table id="ctl00_ContentPlaceholder1_RadDatePicker1_calendar_Top" class="rcMainTable" summary="Table … Steps to reproduce Go to https://achecker.ca/checker/index.php Paste https://demos.telerik.com/aspnet-ajax/datepicker/accessibilityandinternationalization/wcag2.0andsection508accessibility/defaultcs.aspx or https://demos.telerik.com/aspnet-ajax/calendar/accessibility-and-internationalization/wcag-2.0-and-section-508-accessibility/defaultcs.aspx See the results -> Check 245: Data table with more than one row/column of headers does not use id and headers attributes to identify cells. Repair: Add id and headers attributes to table cells so they identify the cells that relate to the headers. Error Line 568, Column 8: <table id="ctl00_ContentPlaceholder1_RadDatePicker1_calendar_Top" class="rcMainTable" summary="Table ... ======================================= WORKAROUND: $telerik.$("table.rcMainTable tbody th").each(function (idx, el) { var thId = $telerik.$(el).attr("id"); $telerik.$(el).siblings("td").attr("header", thId); })
Error message:
Possible workarounds from Admin:
1) Use Lightweight render mode instead of Classic: https://docs.telerik.com/devtools/aspnet-ajax/controls/render-modes#setting-render-mode
2) Disable temporarily the keyboard navigation of the control
3) Use the attached script and load it on the page:
3.1) Using a RadScriptManager (adjust the file name and path to fit your application)
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
<Scripts>
<telerik:RadScriptReference Path="fix.js" OutputPosition="End" />
</Scripts>
</telerik:RadScriptManager>
3.2) In an inline script tag somewhere AFTER the ScriptManager(e.g. at the end of the <form> or <body> tag)
3.3) As a script reference - place it AFTER the script manager as 3.2) or use the defer="defer" attribute
<script defer="defer" src="fix.js"></script>
4) Submit a support ticket if you would prefer a custom Telerik.Web.UI.dll assembly with the issue resolved.
The RadCalendar AccessKey property does not move focus to the RadCalendar control. For example, set the AccessKey="K" for the RadCalendar. <telerik:RadCalendar ID="RadCalendar1" RenderMode="Lightweight" AutoPostBack="true" AccessKey="K" EnableKeyboardNavigation="true" EnableAriaSupport="true" EnableMultiSelect="true" runat="server"></telerik:RadCalendar> However, focused is not moved to the Calendar with the AccessKey using ALT + Shift + key or ALT + key depending on the web browser. Please implement AccessKey for RadCalendar. Thank You, Carla
RadMonthYearPicker is missing form the SkinManager's ControlTypeToApplyskin collection
As I'm using RadDatePicker in my Grid, In RadGrid for the first time, the image beside the calendar control renders as expected. As soon as I enter into "InLine" edit mode there would be 2 images rendered beside the control. And after clicking on cancel there is no change in the image beside the control. Also attached the screenshot for the same.
When we create special days for radCalendar in code behind, we are notre able to set the ItemStyle property because it is readonly. This property should be opened for assignment like we are able to do so when we create SpecialDays in the html script. Thank you, Alain
Put more than two RadDatePicker with single SharedCalendar on page. some RadDatePicker are in side of UpdatePanel with a button in it. when I press that button RadDatePicker behaviour is strange. RadDatePicker inside UpdatePanel not opening Calendar popup while RadDatePicker outside UpdatePanel opens calendar popup but gives javascript error on any date selection. the javascript error is "Unable to get property '_selectedDates' of undefined or null reference". It looks like it is destroying shared calendar object on partial postback. Please find below sample code to replicate the issue. after clicking "Submit" button, it doesn't open calendar popup for "Date 2" and for "Date 1" it opens but doesn't allow to select date and gives JavaScript error. ---------------------- <asp:ScriptManager ID="sc1" runat="server" /> <telerik:RadCalendar ID="dtCal" runat="server" EnableMultiSelect="false" /> Date 1: <telerik:RadDatePicker ID="dt1" Width="103px" runat="server" SharedCalendarID="dtCal" /> <hr /> <asp:UpdatePanel runat="server" ID="up"> <ContentTemplate> Date 2: <telerik:RadDatePicker ID="dt2" Width="103px" runat="server" SharedCalendarID="dtCal" /> <br /> <asp:Button runat="server" ID="btnDT" Text="Submit" /> </ContentTemplate> </asp:UpdatePanel> ---------------------- When i add all controls in UpdatePanel it works properly. but Actual code is much more complex than above sample with too many lines of javascript code and many date pickers on single page and simply all Calendar and DatePicker controls can not be moved in UpdatePanel.
When using min/max date the invalid dates have almost identical styling as the valid ones, this makes it hard for the user to see what dates are valid. It would be nice of there was some way of telling them apart except by hovering over them. Also when using "metro theme" the invalid date overrides the styling for dates belonging to "other month".
Open a demo page https://demos.telerik.com/aspnet-ajax/datetimepicker/overview/defaultcs.aspx?skin=Bootstrap and select Bootstrap skin. You will see that the right corners of the clock button are cutted down. Workaround: .RadPicker .rcSelect { border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important; }
-> When DatePicker renders for the first time, it applies the CSS according to the selected skin. Reference Image: Comtrol in Filter Panel first time render.jpg -> But as soon as I enter into an edit mode or insert than the CSS is not applied to the control and the design of the RadCalender is breaking somehow. Reference Image: Control while Editing.jpg -> Also entering into edit or insert break the design of the other RadCalender control placed in filter panel. Reference Image: Control in Filter Panel.jpg
Hi, I would like RadDatePicker to have DropDown Combo boxes for years and months like attached picture please. Kind Regards, Asaf
RadDatePicker/RadDateTimePicker can not set different date than the current one in Win10 (IE11 and Edge) when Finnish and Norwegian culture is used. Microsoft changed the Time separator for these cultures, it breaks not only our JavaScript parsing but the .NET parsing as well. https://connect.microsoft.com/VisualStudio/Feedback/Details/1621722 The issue is fixed for Q3 2015 SP1. Internally we change the TimeSeparator used by the DateInput to ":" for cultures where it is the same as the DateSeparator. It will not affect the DateFormatString.
Currently we are migrating from ComponentArt controls to Telerik controls. We have replaced date picker with Telerik control. Now, as expected, we need the look, feel and behavior as same as previous one – to ensure the user friendliness. Below are few behaviors which we are looking forward in Telerik control. Please guide/assist us to achieve those. • Type date manually in textbox and user should be able to change it using up and down arrow keys as well. o In ComponentArt control I was able to edit every part of the date viz. dd, mm or yyyy individually when the focus is on individual part of date. o If I press “J” then it will 1st select Jan if I press “J” again then it will select Jun if again then it will select Jul. o If I press “11” then it will select “Nov” automatically or of I press “9” then it will select “Sep” automatically. • Don't want user to key in null/blank values – these should be automatically validated by control. • User should neither wipe out content of text box nor remove a single character from text box. If user presses unnecessary keys then ignore it.
Hi. It would be very good to have an ability to disable autocorrect.