TabIndex

[Stefano Enrico]

When I create input tag, I set the tabIndex attribute.

After I run the function to create the dropdownlist and the tabindex value is set to -1

It's the same for datepicker control

Thanks

[Manikandan Mariappan]

Hi Stefano Enrico,

Thanks for using Syncfusion Products.

While rendering an input element as a widget the “tabindex” is assigned to control wrapper element to get focus. So, we have internally assigned the “tabindex” for input element as -1 for editor components in order to get focus only once to the editor widgets.

Please let us know if you have further queries,

Regards,

Manikandan Mariappan

[Stefano Enrico]

Hi Manikendan,

the original tabIndex = 21

the html result of the widget is:

<span id="Combo1_wrapper" class="e-ddl e-widget" tabindex="0" style="width: 150px; top: 174px; left: 0px;" data-tooltip-var="Tooltip" title="Tooltip da variabile">
    <span id="Combo1_container" class="e-in-wrap e-box">
        <input type="hidden" id="Combo1_hidden" value="1" name="Combo1">
        <input type="text" class="isWrapped e-dropdownlist e-js e-input" id="Combo1" style="height: 29px; width: 150px;" tabindex="-1" data-bind="Combo1" readonly="readonly" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-haspopup="true" aria-owns="Combo1_popup" value="" name="Combo1">
        <span id="Combo1_dropdown" class="e-select" role="button">
              <span class="e-icon e-down-arrow" aria-label="select"></span>
        </span>
</span>
</span>

How to set tabIndex = 21 on the widget?

Thanks

Regards

[Manikandan Mariappan]

Hi Stefano Enrico,

We have achieved your requirement in the following work around solution. Please include the following code snippet in your application.

 

    <script type="text/javascript">

        $(function () {

            $("#combo1").ejDropDownList({

                height: "29px",

                width: "150px",

                //to set the tabindex to the widget initialization time by using create event

                create:"onCreate"

            });

        });

        function onCreate() {

            //this.wrapper is a widget wrapper to assign the tabindex value based on our requirement

            this.wrapper.attr("tabindex", "21");

        }

    </script>

 

 

Please let us know if you have further queries,

Regards,

Manikandan Mariappan

[Stefano Enrico]

Ok, solved with this.element.attr("tabindex", "21");

Thanks

[Sasikala Nagarajan]

Hi Stefano Enrico

We are happy to hear that the issue resolved. Please let us know if you have any other queries.

Regards,

Sasikala Nagarajan