codedance / jquery.AreYouSure

A light-weight jQuery "dirty forms" Plugin - it monitors html forms and alerts users to unsaved changes if they attempt to close the browser or navigate away from the page. (Are you sure?)
508 stars 145 forks source link

Questions regarding usage with bootstrap tabs #71

Open goranata opened 9 years ago

goranata commented 9 years ago

Hi,

I've just chosen to use your jquery.AreYouSure plugin. I was wondering if it is possible to make it the notification window appearing, when I try to switch through the bootstrap built in tabs, e.g. when I click on particular tab.

Thanks in advance,

austra commented 9 years ago

Should be able to do something like this --

$('.tab').click(function (event) { if (confirm('Are you sure you want to change tabs?')) { $.ajax({ url: 'myUrl', type: "POST", data: { // data stuff here }, success: function () { // does some stuff here... } }); } });

codedance commented 9 years ago

Yes. This is possible. If you ave AreYouSure attached to a form, you can check it's "dirty state" any time by simply looking for a class "dirty" on a form. For example, add some code like this on the tabs' click function as suggested by @austra

 if ($('#my-form').hasClass('dirty')) {
     // Show confirm dialog (e.g. a Bootstrap version so it looks nice)
 }

AreYouSure will do all your form watching and state management, as well as trap browser close events, etc. Your code will just be for the on-page tab navigation.