Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

links inside the modal that use data-dismiss="modal" don't go to their destination #7192

Closed
waynn opened this Issue Mar 7, 2013 · 7 comments

Comments

Projects
None yet
7 participants
@waynn
Copy link
Contributor

waynn commented Mar 7, 2013

If I have this bit of code to generate a modal with a link inside it:

<a class="btn" data-toggle="modal" href="#myModal2" role="button">Launch demo modal</a>
<div aria-hidden="true" aria-labelledby="myModalLabel" class="modal hide fade" id="myModal" role="dialog" tabindex="-1">
  <div class="modal-header">
    <a href="http://www.google.com" data-dismiss="modal" data-target="#">Click me</a>
  </div>
</div>

when I click "Click me", it'll dismiss the modal, but it won't end up going to Google.

Is there any way to have a link both dismiss the modal and go to the target in the href? I also created a JSFiddle here that sort of demonstrates it (but given that links to Google don't go any way, it's a little hard to tell): http://jsfiddle.net/waynn/GDL9U/2/

@cvrebert

This comment has been minimized.

Copy link
Member

cvrebert commented Mar 7, 2013

Why bother dismissing the modal if you're leaving the page entirely anyway?

@waynn

This comment has been minimized.

Copy link
Contributor Author

waynn commented Mar 7, 2013

Ah, in this case I'm actually linking to an id on the same page ("chapters#chapter_1"). I just thought the Google example was easier to test.

@fat

This comment has been minimized.

Copy link
Member

fat commented Jun 28, 2013

oo… not currently sadly

@fat fat closed this Jun 28, 2013

@olalonde

This comment has been minimized.

Copy link

olalonde commented Jul 3, 2013

Is there any workaround for this? This is a pretty common thing to do in single page apps.

@morrow95

This comment has been minimized.

Copy link

morrow95 commented Dec 8, 2013

Just stumbled upon this. I am doing something similar although I want to open the link in a new window of the browser and close the modal on click. Note that the modal is a remote page and loaded with ajax. I am sure you could modify the below to fit your needs.

        $("#modal-ajax").on('click',"a[data-window='external']", function() {
            window.open($(this).attr('href')); 
            return false; 
        });

then an example link inside the modal would be like this ...

<a class="btn btn-primary" href="http://www.somesite.com/" data-window="external" data-dismiss="modal">Go there</a>
@kieste

This comment has been minimized.

Copy link

kieste commented Jul 21, 2014

@fat Any chance to get this feature?
In my modal I have a CTA link with target="_blank" and I want to dismiss the modal if the user hits the CTA.

Thanx.

@chrismackie28

This comment has been minimized.

Copy link

chrismackie28 commented Aug 1, 2014

if you have a modal inside a modal eg:(are you sure yes/no) you could use this to close the child modal

$('.closeModal').click(function(){
        $($(this).closest('.modal')).modal('hide');
   })

@twbs twbs locked and limited conversation to collaborators Aug 1, 2014

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
You can’t perform that action at this time.