Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Back End Problem with AJAX-loaded JS content not rendering properly

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #149087
    Deece
    Participant

    I have a problem with a WordPress site I’m developing. The nav menu is loading the page content via AJAX.

    The problem is I find that if I load content via AJAX and if that content contains JS code, the JS will not run. I understand this is because something needs to trigger the code. I also understand that something like jQuery’s .ajaxComplete() might be the answer (or maybe a little PHP is the key). I just don’t know how to make it work generally with all the different apps/plugins out there.

    The specific plugin I’m struggling with is called RoyalSlider. I need to force it to initialize somehow. The plan is to create many different sliders for different pages so it’s important I find a general solution that will force this plugin to initialize. I hope you’ll be able to help. I hope the solution you provide will help me understand how to generally trigger JS code in AJAX loaded content.

    Loaded normally: http://studiodezen.com/wordpress/faded/

    Loaded via AJAX: http://studiodezen.com/wordpress/#http://studiodezen.com/wordpress/faded/

    Thank you for taking the time to read this!

    #149185
    JamesBarnsley
    Participant

    Hi,

    You need to look into the event that is triggering the load menu.

    It will most likely not be using a “live” event.

    Sample of a standard event …

    $(“#some-element-id”).click(function() {

    // if the element with an id of “some-element-id” was loaded by Ajax this code will not trigger

    });

    Sample of a “live” event …

    $(“#some-element-id”).live(“click”, function() {

    // if the element with an id of “some-element-id” was loaded by Ajax this code will trigger

    });

    The reason why it is not initializing is because when the content is downloaded via the Ajax it has not updated the mechanism by which you can attach triggers to the element. So as far as the standard trigger is concerned the element loaded via the Ajax does not even exist. That is why using the “live” method of doing this is the proper way as you can call the “live” method even on elements that where loaded via Ajax.

    Hope that helps.

    James.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘Back End’ is closed to new topics and replies.