user1814016
user1814016

Reputation: 2383

Can I close the Bootstrap modal once the link has been clicked?

Right now, I'm using this in a Bootstrap modal to redirect to a site:

<a href="http://www.example.com/" href="_blank">click</a>

I want the modal to be closed once the link has been clicked, so I thought adding data-dismiss="modal" to the tag would work, however it causes the modal to close without the link being opened.

Can I combine these and make the modal close after the URL opens?

Upvotes: 15

Views: 23510

Answers (7)

Narek
Narek

Reputation: 3823

I added this code to whole project

$(document).on('click', '.modal-hide-continue', function (e){
    $(this).closest('.modal').modal('hide');
});

and it automatically works on any element with class name modal-hide-continue inside the modal.

Upvotes: 0

Mwspace LLC
Mwspace LLC

Reputation: 105

in boostrap 4 :

<a href="http://www.example.com/" data-dismiss="modal" target="_blank">click</a>

Upvotes: 4

user11580136
user11580136

Reputation: 31

This worked for me. <a onclick="location.href='http://www.example.com/';" data-dismiss="modal">click</a>

Upvotes: 3

Ahmed
Ahmed

Reputation: 69

You can use the already existing class in your element:

class="modal-close"

Upvotes: 2

Skylar Ittner
Skylar Ittner

Reputation: 810

This works for me and doesn't require extra script tags:

<a href="http://www.example.com/" onclick="$('#myModal').modal('hide')">click</a>

Upvotes: 18

ilmk
ilmk

Reputation: 592

Add one id to anchor tag. Then you can close the modal using that id once it get clicked.

<a href="http://www.example.com/" href="_blank" id="sample">click</a>

<script>        
    $("a#sample").click(function(){
    $('#myModal').modal('hide')
    });
</script>

Upvotes: 2

Yohn
Yohn

Reputation: 2559

something like the following should do it

$('a').click(function(){
  $('modal-selector').modal('hide')
})

Upvotes: 1

Related Questions