Hi,
When I open igDialog and start pressing tab button, focus goes to all of the parent controls first and then comes to igDialog content. How can I prevent this?
Problem is that if I press enter when focus is on parent page control, it triggers parent page actions. I don't want that to happen. Can you please quickly let me know if there is any simple CSS/JQuery trick to prevent focus going to parent page?
Thanks,
Manjunath M
Hello Manjunath,
I suggest that you do not prevent other elements from getting focused but explicitly set focus on the dialog window when the tab key is pressed:
$(document).on("keydown", function () { if (event.keyCode == 9) { // will return true when the Tab key has been pressed $("#dialog").focus(); // $("#dialog"). should return the DOM element where the igDialog is initialized } });
Also make sure that the DOM element of the igDialog has tabIndex=0 attribute.
Please try this and let me know if it helps.
Hi Hristo,
Thanks for your suggestion but it didn't solve the issue completely. After putting this piece of code current behavior is like this
> First if I place cursor in top url box of the browser and click tab
Focus goes to first control of the parent page(Menu) and then on next tab focus goes to igDialog controls.
> After tabbing out of the last control in the igDialog, focus still remains on last control(button) and never goes back to first control or any other place.
Hello Murgod,
Thank you for your feedback. Could you please attach your sample that duplicates your issue so that I can investigate it and modify / suggest another approach for you ?
Looking forward to hearing from you.
Hello,
I am just checking up to see if you had the time to prepare a sample duplicating this issue.