My function loads many times after show.bs.modal

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.

Leave a Comment

Your email address will not be published.

Scroll to Top