I am trying to modify the autocomplete attribute from an inside a TelerikMultiSelect component. This is the html code generated by the TelerikMultiSelect:
<div data-id="" class="telerik-blazor k-multiselect autocompleteDisabled k-input k-input-solid k-input-md k-rounded-md" dir="ltr"><!--!--><div class="k-input-values" tabindex="-1"><div class="k-chip-list k-chip-list-md"></div><!--!--><input type="text" autocomplete="off" placeholder="" size="1" tabindex="0" class="k-input-inner" role="combobox" aria-busy="false"><!--!--></div><button class="telerik-blazor k-button k-input-button k-button-solid k-button-md k-button-solid-base k-icon-button k-hidden" id=" data-id="" dir="ltr" tabindex="-1" type="button"><!--!--><!--!--><span class="telerik-blazor k-button-icon k-icon k-svg-icon k-svg-i-caret-alt-down" aria-hidden="true"><!--!--><svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!--><!--!--><path d="M256 352 128 160h256z"></path><!--!--></svg></span></button></div>This component, has a "Class" parameter where I can modify the css, but it does not affect to the tag where is the autocomplete attribute. As you can see, by default, the autocomplete is as "off", but I have read that does not work in chrome, so any time I click inside the box, my address is suggested to be filled by the autocomplete.
I have done it with JS, OnAfterRenderAsync I Invoke the JS function and it changes the autocomplete attribute to, for example "disabled" and it stops work. But as I have a project clean of JS using Blazor, this is not the solution I want.
Please, any idea that could help me?
Thank you very much in advance