0

I have multiple html forms on a page and noticed that if the user is tabbing between form elements they can also end up tabbing between forms which I don't want to happen.

I've read the answer about forms that are not being used given here: Multiple forms on one HTML page: how to restrict tabbing to a single form?

I'm wondering if there is now a better way to keep form elements knowingly grouped together y the browser so that tabbing will loop between elements within the same form only. One would think the use of the form tag would suffice but clearly this was something that went over the head of those browser vendors we all know and love.

Edit: This is for a webapp not a desktop website.

Community
  • 1
  • 1
CoreyRS
  • 2,227
  • 3
  • 26
  • 44
  • 2
    You would still have to develop a javascript solution to prevent tabbing outside of a given form. There's nothing new in CSS or HTML to allow tab looping in a single form, that I know of. Tabbing is also an accessibility need. Locking someone into a "tab loop" for a single form element could make your site less accessible friendly. – jmbertucci Aug 17 '12 at 18:37
  • @jmbertucci — +1 for the comment on accessibility. It would effectively make it impossible for some users to access any part of the page except the first form. – Quentin Aug 17 '12 at 19:32
  • maybe i should have mentioned its a mobile web app, so the only tab offering is between form elements. – CoreyRS Aug 17 '12 at 20:00

1 Answers1

1

You probably found a solution already but hope it will help others.

I had similar problem and created tiny jQueryUI plugin that limits fields that TAB affects. you use it simply:

$(".someGroup").tabGuard();

and that will make tab iterate over fields inside of .someGroup wrapper. This way you can group various forms on a page and the one in focus will keep iterating on TAB or Shift+TAB if that makes sense. Find it here:

http://tomaszegiert.seowebsolutions.com.au/tabguard/index.htm

I hope someone will find it useful.

spirytus
  • 10,726
  • 14
  • 61
  • 75
  • ha, i just split the forms across pages because I couldn't find a solution nor was i as experienced with jquery at the time to code something myself, but the plugin works awesome. nice one. – CoreyRS May 24 '13 at 14:49