-
-
Notifications
You must be signed in to change notification settings - Fork 185
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
Cannot Handle Links in content with JQuery #27
Comments
Hi, If you can post an example of your code (especially the part where you bind events and instantiate the modal), I could take a look at this :) |
Having the same issues here. Already tried different variations of either setting up the modal before or after the jQuery content injection, but always getting some JS errors .. |
Code example: var strSearchPageURL = jQuery('.menu .link-search a, .search-link, a.link-search').eq(0).attr('href');
if( strSearchPageURL != '' ) {
var modalSearch = new tingle.modal({
footer: true,
onOpen: function() {
console.log('opened search modal ..');
},
onClose: function() {
console.info('closed search modal!');
},
});
jQuery.get( strSearchPageURL, function( data ) {
var strSearchPageContent = jQuery( data ).find('#main').html();
//strSearchPageOverlay = '<div class="modal search-page" id="search-modal">' + strSearchPageContent + '</div>';
//strSearchPageOverlay = '<div class="modal search-page closed" id="search-modal">' + strSearchPageContent + '</div>';
//document.getElementsByTagName('body')[0].insertAdjacentHTML('afterbegin', strSearchPageOverlay );
modalSearch.setContent( '<div class="tingle-content-wrapper">' + strSearchPageContent + '</div>' );
});
jQuery('.menu .link-search a, .search-link, a.link-search').on('click', function( e ) {
e.preventDefault();
modalSearch.open();
});
} This essentially digs up the URL to the search page of a WordPress site I'm developing for a client, uses AJAX to get that singular page and parses out the important part, ie. the content. Thus, we insert that filtered-out content .. and after that, add an event listener. Which doesnt seem to work :( FYI: Before trying out tingle, I've been fiddling around with Magnificent Popup. Which after all is NOT so magnificent because its lacking style. ALL of it, you oughta style it completely for yourself, with no real defaults to go for. So thats why I thought a non-jQuery-dependent, simple, but already prepared modal script would be a better option .. now if it just WOULD WORK!!! .. cu, w0lf. |
So, I assume this part doesn't work?
What error message did you get? |
Firebug / JS-Console says:
cu, w0lf. |
Possible bugfix: var bodyTag = document.getElementsByTagName('body')[0];
bodyTag.classList.add('tingle-enabled'); At least, that works for me ;) cu, w0lf. |
Interesting part is: At some point you've been using I've replaced all calls to plain ole cu, w0lf. |
Just created a pull request. The issue as such is: the variable |
Hi guys, `` here is what I did to handle links in the modal content: and then to handle:
Hope it helps! |
Hey, sorry for the late reply! Good catch, there's no need to use an intermediate variable for body (this comes from a previous refactoring). However, I do not think the problem you had was a scope problem (body was shared inside tingle IIFE). It's probably because tingle was loaded in the HEAD, so during initialization, body was equal to null. By removing the body variable, body was used during tingle opening (so, after DOM fully loaded). In any case, this is now fixed. Thanks for filing an issue and for your PR :) |
@melkishengue So you attach your event after passing your content to tingle? |
Hi Robin,
just wanted to know there was a way to handle the links in the content of the modal, with JQuerys eventListeners for example. When I click on these Links they just don't react, although I attached some eventlisteners to them. I really find your plugin awesome ;)
Thanks.
The text was updated successfully, but these errors were encountered: