CODEWITHSUNDEEP
javascriptkendo-uitelerikkendo-dropdown
Brian Mains
Brian Mains

Reputation: 50728

KendoDropDownList TabIndex not taking effect

I'm using the KendoDropDownList widget and in the markup, the select element has tabindex="600" set on it. But it isn't taking effect. I do see it in the final markup that's rendered to the client.

<span style="" title="" class="k-widget k-dropdown k-header form-control"
     unselectable="on" role="listbox" aria-haspopup="true" 
     aria-expanded="false" tabindex="610" 
     aria-owns="PropertyAddress_State_listbox" 
     aria-disabled="false" aria-readonly="false" aria-busy="false">

    <span class="k-dropdown-wrap k-state-default" unselectable="on">
        <span class="k-input" unselectable="on">CA</span>
        <span class="k-select" unselectable="on">
            <span class="k-icon k-i-arrow-s" unselectable="on">select</span
        </span>
    </span>
    <select name="PropertyAddress.State" id="PropertyAddress_State" 
        data-role="dropdownlist" class="form-control" style="display: none;">
      <option value="AK">AK</option>
      <option value="AL">AL</option>
      .
      .
    </select>
</span>

But tabbing does not trigger a dropdown as a normal select element would. any idea how and if it can work?

Upvotes: 0

Views: 1548

Answers (1)

George K
George K

Reputation: 1763

In general, the Kendo UI DropDownList moves the tabindex from the original element to the visible focusable element ( in this case). As to the issue, I could not replicate it:

Here is the demo:

Upvotes: 1

Related Questions