Frame within a HTML-Form, how Tab Key works?

Question

I have a HTML-Form with a lot of Inputs. In the middle is a Frame for WYSIWYG-Editor (Xinha). You can jump from one input to the next. So you can start at the first input and go with the Tab-Key to the last one. But it don't jump into the Frame and out. How can I change it? How can I give the Frame a tabstop? Tab-Index don't help.

Thank you

Burner

Answer 1

If your WYSIWYG-Editor isn´t able to do this, you´ll need to add event listeners to both sites. Key event listeners at each form element in the form site and one for tab in the frame site. You will also need an custom event in the main page, which you can trigger from inside frame. This event then should take focus from the frame to the next form element. Also your key listener should take manually the focus to the next field by preventing the default action.

As far as I know, TinyMCE uses per default an (i)frame for the editor content. Maybe you should also look at TinyMCE for a simplier solution.

Answer 2

Are you sure, You want to use Frame for WYSIWYG editor?

Try CK Editor, Tab works fine.

Answer 3

There is no cross-browser way for this with an inner frame. You can hook on the keydown events in both the parent and the child form but it's a dirty and unpaved road of doing this. A better approach would be to look for a better editor that manages without iframe.

If your editor doesn't actually NEED the iframe (they just recommend to put it into one) maybe you could try $.load() -ing it into a div.