Question

I have a external link inside my modal, and I want the modal to hide after the user has clicked on the link. How do I do that?

Here is my code:

<div class="modal hide fade" id="modalwindow">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h3>Title</h3>
  </div>
  <div class="modal-body">
    <p>You need to do a search on google.com for that.</p>
  </div>
  <div class="modal-footer">
    <a id="closemodal" href="https://www.google.com" class="btn btn-primary" target="_blank">Launch google.com</a>
  </div>
</div>

<script type="text/javascript">
    $('#closemodal').modal('hide');
</script>

Answer 1

You need to bind the modal hide call to the onclick event.

Assuming you are using jQuery you can do that with:

$('#closemodal').click(function() {
    $('#modalwindow').modal('hide');
});

Also make sure the click event is bound after the document has finished loading:

$(function() {
   // Place the above code inside this block
});
enter code here