Question

I posted recently regarding onbeforeunload implementation. Its working now but that only solved half of the problem. My application has lot of tabs and I want to throw this same confirmation to user if he clicks on a new tab without saving changes. all the tabs are div elements. How do you implement something of this sort?
Sample tab structure is attached, where every tab loads a new page.

Answer 1

Something like this would help you. You need to add the clickHandler to each tab click event.

var dirty = false;

function clickHandler(){
     if (dirty && confirm('you are leaving the tab, wanna stay and save?')){
         return false; //prevent default
     }
     else {
         dirty = false;
         //trigger your tab load
     }
}