CODEWITHSUNDEEP
jquerycssknockout.js
RobVious
RobVious

Reputation: 12915

Control which element should have focus() next when tab is pressed from an input field

I have a list of elements on a page, some of which are inputs, other anchors, etc etc. When I'm on an input, I want to tell the browser which input tab should push the focus to if I hit tab.

Right now one of my inputs is pushing me to a menu item when I hit tab; I want it to go to the next input. I'm looking for a general approach here as I have no clue where to start.

The number and names of my input fields are dynamic as well.

I'm using knockout in case it's relevant.

Upvotes: 0

Views: 889

Answers (2)

krishwader
krishwader

Reputation: 11371

To supplement @BrunoLM's answer, you could use tabindex with attr binding if you're going dynamic, like when you want to control the effect of tab key on inputs. 

<input type="text" data-bind="attr :{'tabindex' : dynamicNumber "}" />    

<a data-bind="attr: { href: url, title: details }">Report </a>

<input type="text" data-bind="attr :{'tabindex' : dynamicNumber "}" />

Upvotes: 1

BrunoLM
BrunoLM

Reputation: 100321

Set tabindex attribute on html

Example on jsFiddle

<input type="text" tabindex="1" />
<input type="text" tabindex="4" />
<input type="text" tabindex="3" />
<input type="text" tabindex="2" />

Upvotes: 4

Related Questions