Button click not firing in modal window (Bootstrap)

javascript, jquery, twitter-bootstrap

Solution

Try this -

$(document).on("click", "#submit_btn", function(event){
    alert( "GO" ); 
});

Or this -

$(document).delegate("#submit_btn", "click", function(event){
    alert( "GO" ); 
});

If you are using an older version of jQuery you may have to use the live method instead.

Live method (use this only if you have to)

$("#submit_btn").live("click", function(event){
    alert( "GO" ); 
});

I'm fairly certain that one of these 3 methods above will solve your issue. The reason your event handler doesn't work is because your submit_btn element doesn't exist at the time your event handler is evaluated. The above 3 handlers I gave you will work on a submit_btn element that exists now and in the future.

/edit

Here is a jsfiddle that works - http://jsfiddle.net/GqD4f/8/

/another edit

I made a jsfiddle using the approach you had in your post and it works - http://jsfiddle.net/CR3bM/1/

Are you not putting your event handler in DOM ready?

Problem

I have a button in a modal window: ``` <button id="submit_btn" class="btn btn-link">Send the invitation</button> ``` I'm trying to capture the click: ``` $('#submit_btn').click(function(event){ event.preventDefault(); alert( "GO" ); }); ``` I've read that button clicks get swallowed in modal windows and that, to prevent that, use event.preventDefault(). But that's not working. I can't capture the click event of this button. What else am I missing? Any tips are greatly appreciated!

Original source