Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 17401
  • Last Modified:

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">
0
JElster
Asked:
JElster
  • 5
  • 3
1 Solution
 
GaryCommented:
How is the modal triggered? Attach the event to whatever element triggers it.
0
 
JElsterAuthor Commented:
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'
0
 
GaryCommented:
Where you bind the dialog you can add your own functions for open/close

$( "#editnote" ).dialog({
close: function( event, ui ) { // add your code here }
open: function( event, ui ) { // add your code here }
});

Open in new window

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
JElsterAuthor Commented:
I tried adding that.. doesn't do anything
nor this
   $('#editnote').on('shown.bs.modal', function () {
        alert('show event fired!');
    });
0
 
GaryCommented:
Do you have a live link
Just double checked your original code locally and it works fine.
0
 
GaryCommented:
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
0
 
JElsterAuthor Commented:
Tried that.. still nothing and no JS errors..............?????????
0
 
GaryCommented:
Post all your code.
0
 
RobOwner (Aidellio)Commented:
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
0

Featured Post

Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

  • 5
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now