2

Im attempting to set the tab index on all the input elements in a form that is displayed with a jquery dialog. The current behavior is that when the user starts to tab (the first element is set to focus so that is the first in line) they can tab through the all the controls. The issue us that they can continue to tab to the elements behind the dialog.

Is there a way that I can prevent this from happening and ONLY tab through the form elements in the open dialog?

3 Answers 3

1

I'm giving you the logic. you can write code accordingly.

On the last element of your form add an event handler to handle key press event.

Inside the handler function you have to return true if key is not TAB otherwise return false.

That means only non-TAB keys will work on that field.

You can google ascii code of tab. you google code to handle key events.

Thank You

1
  • If you are using jquery then call event.preventDefault() in the handler function if TAB is pressed.
    – Imdad
    Sep 20, 2011 at 21:20
1

count how many elements you have and set it so that if your tabindex == numberOfTabs that it will reset to the original index.

if you need to do this outside of any functionality etc do it with a hidden input

then in the js for the tab event access and update the tabindexCurrent val() to the new one

1

Yes, there is a solution to this problem. I was facing the same problem.

To make it work you have to use jquery.ui.dialog.js … include it on your page. Also add your jQuery modal dialog code in document.ready.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.