CODEWITHSUNDEEP
javascripthtml
Shawn
Shawn

Reputation: 19803

HTML modal popup can lose focus by tabbing to form fields in background

I have modal popup with an overlay written in html / js, everything works fine but if a user tabs enough they can get to the underlying form fields / buttons. Is there any good way of preventing this?

Upvotes: 2

Views: 804

Answers (1)

connrs
connrs

Reputation: 283

This is a rough idea but I'm hoping to inspire ideas rather than tell you exactly how to do it. I'll use a combination of pseudocode and pseudo-jquery-code:

function showMymodaldExample() {
    //Show modal dialog (mymodal) code goes here
    //
    //Then we bind an event
    $(document).bind('mymodal.keydown', function(e) {
        if ( currently focussed element is not a child of mymodal ) {
            set the focus previous element
        }
    });
}

And then remember to unbind mymodal.keydown when you destroy/hide the dialog

Upvotes: 2

Related Questions