Link to home
Start Free TrialLog in
Avatar of JElster
JElsterFlag for United States of America

asked on

Bootstrap modal how to fire event on shown and hide

Hi..
I'm using Bootstrap. I'm trying to fire an event when the modal 'window' is shown. but it never fire and don't get any errors. Any idea what's wrong with this?
thx

<!-- EDIT NOTES SECTION -->
<script>
    $('#editnote').on('hidden.bs.modal', function () {
        alert('hidden event fired!');
    });

    $('#editnote').on('shown.bs.modal', function () {
        alert('show event fired!');
    });
</script>

<div id="editnote" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
Avatar of Gary
Gary
Flag of Ireland image

How is the modal triggered? Attach the event to whatever element triggers it.
Avatar of JElster

ASKER

bootstrap js.. that know this is modal...  it's a link like this that is clicked - opens the modal window

<a href='#editnote' data-toggle='modal'
ASKER CERTIFIED SOLUTION
Avatar of Gary
Gary
Flag of Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of JElster

ASKER

I tried adding that.. doesn't do anything
nor this
   $('#editnote').on('shown.bs.modal', function () {
        alert('show event fired!');
    });
Do you have a live link
Just double checked your original code locally and it works fine.
Where is the above script located? Is it at the end of the page?
If not you need to wrap it in a document ready function
Avatar of JElster

ASKER

Tried that.. still nothing and no JS errors..............?????????
Post all your code.
Hi JElster,

You're sure you've included jquery in your project? All these bootstrap plugins require it

http://getbootstrap.com/javascript/#js-individual-compiled

Cheers,

Rob