How to read jquery modal popup DIV elements in JAWS by skipping what it was reading?

Question

we have a site that uses jQuery to display a modal popup. When user click on one of our buttons we are loading/binding the modal popup to a DIV then shows a DIV that contains the actual popup on top of the overlay. So how can i get focus inside the modal when it pops up so that the screen reader stops what its doing and starts reading inside the modal.

 $("#EditPageForm").dialog({
                     autoOpen: true,
                     position: { my: "center", at: "center", of: window },
                     width: 650,
                     resizable: false,
                     title: 'Edit Page',
                     modal: true,
                     open: function () {
                         $(this).load('@Url.Action("EditPage", "Page")');  
                         $(this).focus();

                     },
                     buttons: {....}
});

$(this).focus(); is not really focusing into the popup.

Thanks

Answer 1

Jquery focus works only with focusable elements. Forms or links.

Store the current focus position and use tabindex=-1 on every form and link in the page before open the pop up, the use tabindex=0 on the pop up and focus it. When closing the pop up focus the stored focus position.

With this solution, use couldn't focus "under" the pop up. And retrieve the position after closing the pop up.