Skip to content
This repository has been archived by the owner on Jun 14, 2020. It is now read-only.

qTip stops modal from opening more than once #819

Open
lzinga opened this issue Mar 2, 2017 · 0 comments
Open

qTip stops modal from opening more than once #819

lzinga opened this issue Mar 2, 2017 · 0 comments

Comments

@lzinga
Copy link

lzinga commented Mar 2, 2017

Right now I have a tooltip that has links in it. the links are supposed to open a magnific.popup. Which it successfully does the first time and as long as the qTip stays open.

Once the qTip closes all the configuration for the modal popup seems to break and the links just redirect to the actual raw link inside the anchor instead of even trying to open the modal box.

magnific.popup has an ajax option which uses an anchors href for what to load. So in the anchor below it would load the href into a modal box with out redirecting the page or anything.
<a data-modal-ajax href="/test/ajax/index">Click me to open an ajax modal pop up to the href</a>

Which I use elsewhere outside of qTips and it works fine, however when I put it into the qTip it opens the modal once and just never again once the qTip closes. Unless a page refresh happens which it will only open once and then break onec the qTip closes.

Here is the item that I use when clicked it opens the pop up:

<i class="fa fa-exclamation-triangle error" data-tip="#tip-test" aria-hidden="true"></i>
<div id="tip-test">
        ....
</div>

So when you click on the element it uses the data-tip info to know which div is the content of the tooltip.

Here is the magnific pop up code:

        $('[data-modal-ajax]').magnificPopup({
            settings: {
                cache: false
            },
            type: 'ajax',
            showCloseBtn: false,
            closeOnBgClick: false
        });

Here is the qTip code:

        $('[data-tip]').qtip({
            content: function() {
                return $($(this).data("tip"));
            },
            show: 'click',
            hide: {
                delay: 500,
                fixed: true
            },
            style: {
                classes: 'qtip-dark'
            }
        });

JsFiddle showing what is happening. If you click the "Test" and then click the test inside the tooltip, you will see the modal box appears. If you click inside the black overlay for it to disappear it will allow you to click the link again. Once you click the link again click the link in the qtip it will try to change to the actual url.

I am not exactly sure if this belongs in the qTip or the Magnific.Popup git but I figured I would put it here since it seems to be something qTip is doing that is causing issues.

For those who are likely to see no response to this as there are a ton of issues opened and no responses. I switched over to http://iamceege.github.io/tooltipster/ and it works as expected.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant