Hello Trena,

Thank you for describing the accessibility issues related to tooltip icons and for your attempt to resolve them programmatically.

Currently, Kendo UI for jQuery (used in Kendo UI for ASP.NET MVC) does not provide built-in configuration options to directly customize accessibility attributes, such as aria-hidden or focusable for tooltip icons. The rendering and attributes of these icons are managed internally by the component, and there is no exposed API to adjust them through component configuration.

Workaround Limitations

Using JavaScript or jQuery to modify these attributes after component initialization is the only available workaround. However, as you noticed, this approach may not be reliable because the component might re-render its DOM, which can revert your changes.

Most components have a dataBound event exposed, which fires when the component is bound to data from its data source. This is a good place to modify the attributes after component initialization.

Alternative Approaches

• Custom Tooltip Implementation: If you require full control over the HTML and accessibility attributes, you can create a custom tooltip using your own markup and logic. This allows you to ensure all accessibility requirements are met.
• CSS Customization: For appearance-related changes, you can override Kendo UI styles by targeting the relevant CSS classes. More information is available here:
  • http://docs.telerik.com/kendo-ui/styles-and-layout/appearance-styling#customization-of-appearance

Regards,
Nikolay
Progress Telerik