tabindex in React Upload Component

2 posts, 0 answers
  1. SoH
    SoH avatar
    9 posts
    Member since:
    Jun 2017

    Posted 09 Nov 2020 Link to this post

    The Upload <li class="k-file"> gets a tabindex="-1" inserted

    and the Upload button also:

    <button type="button" tabindex="-1" class="k-button k-button-icon k-flat k-upload-action"><span aria-label="Remove" title="Remove" class="k-icon k-delete k-i-x"></span></button>


    I've tried overriding this by adding tabindex={0}, but this is not working.


    I need to be able to tab to the Upload li (or it's div parent) and button?

    How can I override the insertion of tabindex="-1"?

        onAdd={e => props.onAdd(e)}
        onRemove={e => props.onRemove(e)}
        onProgress={e => props.onProgress(e)}
        onStatusChange={e => props.onStatusChange(e)}
  2. Stefan
    Stefan avatar
    3034 posts

    Posted 10 Nov 2020 Link to this post


    This is because the Upload has its own built-in keyboard navigation which internally manages the focused element:

    If we add a tabindex to the element, this could interfere with the built-in navigation and results is unexpected focused elements.

    If there is a specific issue using the built-in navigation, please let me know and I will be happy to assist further.

    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at

Back to Top