Modal hidden action is not being triggered

Question

I want to use the Hidden event on modals like this:

<div class="modal fade" id="modalthing" role="dialog">
    <div class="modal-dialog modal-md" role="document">
        <div class="modal-content">
           <div class="modal-header">
              <div class="modal-body">
              <form>
               //etc
              </form>
              </div>
           </div>
        </div>
    </div>
</div>

And my javascript is:

$('#modalthing').on('hidden.bs.modal', function (e) {
    console.log('test');
})

But my code is just nog executing the console.log

Am I missing something here? I got the code from the official bootstrap documentation and this question but I cant for the life of me figure out why it isnt triggering the event.

@Mokkun Yes. My modal opens and closes but the event is not triggered. — Loko, May 10 '17 at 07:55
Hmm did you try putting your function inside a $(document).ready(function() {}); — Mokkun, May 10 '17 at 07:57
Where have you instanciated your modal? As per [this answer](http://stackoverflow.com/questions/19279629/bootstrap-jquery-show-bs-modal-event-wont-fire) you need to put the listener before you the part where you close it. If that's not it, then still check that question. I'm sure you'll find an answer there. — Chris, May 10 '17 at 07:59
@Chris the modal opens through a button: `` This button is after the modal. — Loko, May 10 '17 at 08:03
Have you tried: `$('#modalthing').on('hidden.bs.modal', '#modalthing', function (e) { console.log('test'); })` — Chris, May 10 '17 at 08:05

score 0 · Answer 1 · answered May 10 '17 at 08:42

0

I think you should use data-dismiss attribute in closer buttons like this:

<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>

I tried it on w3Schools editor and it executed.

answered May 10 '17 at 08:42

Ekrem Değer

45
9

I have that but it's still not triggering. – Loko May 10 '17 at 08:48

Modal hidden action is not being triggered

1 Answers1