Never fired hidden.bs.modal on the second close

[nchankov]

When you open the modal or the first time then close it, and again open it it never fires hide.bs.modal as well as hidden.bs.modal

I've prepared a demo: http://jsfiddle.net/84yTH/3/

To reproduce:

1. Click on the button
2. Close the modal (Closed text appeared)
3. Click on the button again
4. Close the modal - nothing appeared

If the bootstrap-modal.js is removed it fires correctly the event every time: http://jsfiddle.net/84yTH/4/

Also I can't close the modal when I press Esc key (am I doing something wrong or it's a bug?)

[nchankov]

Forget about close with Esc, it's working on the demo, so I messed up something on my project or it collide with something else.

I've seen that you are firing hidden event which work all the times, so I will use it instead of hidden.bs.modal for now

[amites]

I'm seeing the same issue with 'shown.bs.modal' -- will put a jsfiddle together or perhaps a fork -- but wanted to get the report in

simple approach to spot, add

$('#ajax-modal').on('shown.bs.modal', function(e) {
    console.log('hello bind');
});

console will report the first time but lost after that -- with most recent git pull it also loses the animation graphic while loading the 2nd+ time

[caseyjhol]

+1

[Mantus667]

+1

[RickWong]

+1 This project seems abandoned.

[jschr]

Sorry this went unnoticed. I believe the issue lies somewhere in jQuery (still hunting down the exact cause) but this plugin was desgined for BS2 originally and still fires the non-namespaced version of the events. jQuery seems to be able to match the namespace but only on the first call? Bizarre. If you change your event listeners to the BS2 versions you shouldn't run into this issue:

$modal.on('show', function () { ... }
$modal.on('shown', function () { ... }
$modal.on('hide', function () { ... }
$modal.on('hidden', function () { ... }

[RickWong]

Thanks. I can confirm that the above work-around fixes it for now.

[GrantRWinter]

+1

[iruy]

You have to use jquery like this for delegation: $(container).on(event, selector, function(){});

$(document).on('hidden.bs.modal', '#responsive', function(){ /your code/ });

[liuruting]

Thanks. Using show, shown, hide and hidden works.

[albertofortes]

@iruy +1

[UmeshAawte]

hidden.bs.modal did worked for but shown.bs.modal did not.

[borland502]

Thank you @iruy +1.

[Valamiro]

Thank you @iruy +1.

[adamcurl]

Thank you @iruy +1.

[AhmedEzzat12]

Thanks $(document).on('hidden.bs.modal', '#responsive', function(){ /your code/ }); worked for me