The Upload <li class="k-file"> gets a tabindex="-1" insertedand 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"?
<Upload autoUpload={false} showActionButtons={false} batch={false} multiple={false} files={props.files} onAdd={e => props.onAdd(e)} onRemove={e => props.onRemove(e)} onProgress={e => props.onProgress(e)} onStatusChange={e => props.onStatusChange(e)} tabindex={0}/>1 Answer, 1 is accepted
Hello,
This is because the Upload has its own built-in keyboard navigation which internally manages the focused element:
https://www.telerik.com/kendo-react-ui/components/upload/keyboard-navigation/
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.
Regards,
Stefan
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 https://learn.telerik.com/.