seo Question posted in
Some basic information to get you started with this can be found here.

Reinitlaizing jQuery after AJAX not working fully – SEO

I’m trying to add a jQuery gallery to a dynamic php page that uses an AJAX menu to filter products (Magento). When a selectable menu item is released or the ‘clear all’ button is pushed to reload the original stack of products, my gallery reloads and the script doesn’t fully come back. The correct spaces for the gallery images come back like empty placeholders but the images do not show up.
This is the 2 seperate scripts I tried to reinitialize the gallery:

Current script:

<script type="text/javascript" charset="utf-8">
    $(document).bind('m-ajax-after')(function() {
        $('#gallery').finalTilesGallery();
    });
</script>

1st attempt:

jQuery(document).bind('m-ajax-after', function(e, selectors, url, action) {
    $('#gallery').finalTilesGallery();
});

Before I added this script the gallery wouldn’t display at all so I know I’m at least on the right track.

It looks like the extension that m-ajax-after is referring to is ManaDev SEO Layered Navigation Plus. http://www.manadev.com/seo-layered-navigation-plus/
I’ve found in multiple forums around the internet they suggest using this snippet to reinitialize any jQuery after their menu reloads:

jQuery(document).bind('m-ajax-after', function (e, selectors, url, action) {
    // reinitialize your script 
});

They don’t however offer any support as to how or why this works.

Tags:

2

Answers


  1. 0

    Googling “m-ajax-after” doesn’t really return much to work with. I can’t find any documentation of this event, or what versions it applies to (or what it does).

    But, if you have such an event, you’re attaching it incorrectly:

    $(document).bind('m-ajax-after') (function() {

    The correct way to write it would be:

    $(document).bind('m-ajax-after', function() {

    Assuming that you haven’t got an ancient version of jQuery though, there is a more prefered way:

    $(document).on('m-ajax-after', function() {

    You can easily test if this gets called when you expect, by adding for example an alert:

    $(document).on('m-ajax-after', function() {
    alert('m-ajax-after invoked');
    $('#gallery').finalTilesGallery(); //Final Tiles Grid function apparently
});

    Thing is though, that your 1st attempt is correctly written, and probably should have worked. But it’s worth trying without all the parameters, and with the alert.

    Login or Signup to reply.
  2. 0

    I fell into the same issue, Check you haven’t got more than one jQuery coming into the page

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search