I'm using jquery-confirm plugin and Bootstrap 3. The confirmation works fine but if I open any bootstrap modal on the page before clicking the confirmation button, two confirmation box pop up. If I open bootstrap modal 5 times before clicking the confirmation button, It triggers five confirmation box at the same time overlaying one after another. Why this happening?
Here is my js:
$('body').on('click', '.confirm', function(e) {
e.preventDefault();
var form = this.closest("form");
$.confirm({
title: "confirmation",
content: "Are you sure?",
buttons: {
'confirm': {
text: 'proceed',
keys: ['enter'],
btnClass: 'btn-red',
action: function () {
form.submit();
}
},
'cancel': {
text: 'cancel',
action: function () {
return false;
}
},
}
});
});
What I'm doing wrong?
The problem was in my code. There was a point where the confirmation reinitialize every time when loading a modal. That makes it trigger multiple times for a single button. Move the initialization code to another place solved the issue. Thank you guys.