Reload Flexslider in VirtueMart Product Dinamically - Joomla! Forum - community, help and support

hello everyone!

after doing lot of research, decided post question here. not sure if correct section of forum, please forgive me moderators if that's case

i'm using virtuemart flexslider displaying product images. flexslider loading code:

code: select all

jquery(document).ready(function($) { ...}

that's inside templatewhatevernameimages.php.

when product loads, works fine. when using product navigator dynamically changes
the product without loading page again. if i'm not wrong, should code makes this:

code: select all

vmjsapi::jdynupdate();
vmjsapi::addjscript('upddynamiclisteners',"
jquery(document).ready(function() {
   if (virtuemart.container)
      virtuemart.updatedynamicupdatelisteners();

}); ");


now, problem that, since products has child products, user changes size , color of products (its clothing). when happens, child product loaded , gallery disappears.

no error displayed in console, , can see in inspector, images , required html code in page. think problem is, javascript code builds gallery again, not loaded again after changing product.

i tried changing gallery script $(window).bing("load", function(){...} instead of $(window).load(function() or $(window).ready(function() without success.

i tried create function calls builder again, , add vmjsapi::addjscript('upddynamiclisteners'). did:

code: select all

vmjsapi::addjscript('upddynamiclisteners', buildgallery());

and in other side, create

code: select all

function buildgallery($){
            $('#carousel').flexslider({
              animation: "slide",
              controlnav: false,
              animationloop: false,
              slideshow: false,
              itemwidth: 210,
              itemmargin: 5,
              asnavfor: '#slider'
            });

            $('#slider').flexslider({
              animation: "slide",
              controlnav: false,
              animationloop: false,
              slideshow: false,
              sync: "#carousel"
            }); }

that way, function called when user changes size/color of product, got: $ not object. then, enclose function inside $(window).load(function() having way:

code: select all

function buildgallery($){
     $(window).load(function() {
           $('#carousel').flexslider({...});
           $('#slider').flexslider({...});

but then, no errors no gallery. because since page not loaded again, load function not called again.

any ideas?

thanks in advance!!