I tried making a jquery function that works together with a bpopup (iframe) function. I want to show a confirmation message before trying to close the iframe. I added a confirm message that shows after a change but after i submit the form the confirm box gets duplicated. I tried debugging and checked how many times the function got executed so i did a console.log but this console.log only executed once when the confirm message got executed multiple times. this is the function:
function confirm_changed(){
var changed = false;
$('.b-modal', parent.document).on('click', function(){
if(changed && confirm('Weet je zeker dat je dit scherm wilt verlaten?')){
$('.b-modal', parent.document).removeClass('changed');
}
});
$(document).one('input', function(){
$('.b-modal', parent.document).addClass('changed');
changed = true;
});
}
This function gets called in the document.ready and this is the bpopup prototype function where i added the condition for the confirm message:
function r(){
setTimeout(function(){
if(c('.changed').length === 0){
a.modal && c(".b-modal." + b.data("id")).fadeTo(a.speed, 0, function(){
c(this).remove()
});
a.scrollBar || c("html").css("overflow", "auto");
c(".b-modal." + e).unbind("click");
f.unbind("keydown." + e);
k.unbind("." + e).data("bPopup", 0 < k.data("bPopup") - 1 ? k.data("bPopup") - 1 : null);
b.undelegate(".bClose, ." + a.closeClass, "click." + e, r).data("bPopup", null);
clearTimeout(H);
G();
return !1
}
}, 0);
}
This function closes the iframe.
I added the timeout so that this function gets executed after the confirm message. after the form gets submitted and everything went through the validations the class gets deleted.