That is because you use an event handler to settle another.
Every times edit_order
runs, an event handler is registered to listen to click events. And when that occurs, a new show.bs.modal
event handler is registered. So if you run the edit_order
more than once, you have multiple handlers to set some new hadlers for #myModal2
… And here is the multiplication effect.
So given that very tiny code, I would suggest a quick fix: use .one()
instead of on()
for the click on a.edit
. So the handler on #myModal2
would be setted only once.
But it would be a nice idea to review how you set you event handlers… You probably do the same mistake many places. Reminder: Do not use an event to register an event handler. 😉
So here is the quick fix that should work for that one:
function edit_order(tbody, datatable) {
//ON CLICK <a class="edit"></a>
$(tbody).one("click", "a.edit", function() { // <-- .one here
$('#myModal2').on('show.bs.modal', function(event) {
var modal = $(this);
console.log("Modal Open");
})
});
}
In short, that should be enough (Why is that in a named-function anyway?):
$('#myModal2').on('show.bs.modal', function(event) {
var modal = $(this);
console.log("Modal Open");
})
CLICK HERE to find out more related problems solutions.