NumericTextBox Accessibility

The NumericTextBox is accessible by screen readers and provides WAI-ARIA, Section 508, WCAG 2.1, and keyboard support.

For more information, refer to:

WAI-ARIA

The component follows the WAI-ARIA Authoring Practices for implementing the keyboard navigation for its component role and is tested against the popular screen readers.

Section 508

The NumericTextBox is compliant with the Section 508 requirements.

WCAG 2.1

The NumericTextBox supports the standards for providing accessible web content which are set by the Web Content Accessibility Guidelines 2.1.

label Element Support

Because of the NumericTextBox complex rendering, to focus the widget through the label element, you need to manually handle the click event of the label and focus the NumericTextBox.

    @Html.Label("numeric", "Value")
    @Html.Kendo().NumericTextBox().Name("numeric")

    <script>
        var roles = {
        numerictextbox: "kendoNumericTextBox",
        combobox: "kendoComboBox",
        multiselect: "kendoMultiSelect"
        }

        function getWidget(element) {
        var role = element.data("role");
        role = roles[role];

        if (role) {
            return element.data(role);
        }    
        }

        $("label").click(function() {
        var label = $(this),
            id = label.attr("for"),
            widget;

        if (id) {
            widget = getWidget($("#" + id));
            if (widget) {
            widget.focus();
            }
        }
        });
    </script>

See Also

In this article
Not finding the help you need? Improve this article