VirtueMart Forum

VirtueMart 2 + 3 + 4 => Product creation => Topic started by: caesarsk on March 09, 2016, 12:04:24 PM

Title: multi variant custom fields - call scripts after change option
Post by: caesarsk on March 09, 2016, 12:04:24 PM
Hi all,

i using custom fields and multi variants for my products (color and size). At the same time I use a few extensions, such as zoom and jquery UI accordition function.
Everything works as it should (no jquery conflict etc.), the problem occurs when I change product parameters (e.g. color). The image is correctly loaded, but the scripts is not (no zoom, no accorition).
When I refreshing this page is of course everything is fine.

How do I call these scripts when I changing CF??

please help me, thx.
Title: Re: multi variant custom fields - call scripts after change option
Post by: GJC Web Design on March 09, 2016, 23:26:19 PM
Thanks to my JS guru Spyros at https://www.virtuemarttemplates.eu/ he fixed my same issue with moving the JS scripts of e.g. zoom to the bottom of the prod details template and call them there with the native VM JS call

e.g.  (your code will be different)

//zoom
$j = '
var show_img="window"
function Zoom() {
jQuery("#Img_zoom2").elevateZoom({
gallery:"gallery_02" ,
cursor: "pointer" ,
zoomWindowPosition: 1,
zoomWindowOffetx: 10,
zoomWindowHeight: 360,
zoomWindowWidth:360,
zoomWindowFadeIn: 500,
zoomWindowFadeOut: 500,
lensFadeIn: 500,
lensFadeOut: 500,
showLens:true,
zoomType:show_img,
containLensZoom :false,
easing : true,
galleryActiveClass: "zoomThumbActive active",
loadingIcon: "images/ajax-loader.gif"
});
jQuery("#Img_zoom2").bind("click", function(e) { 
  var ez =   jQuery("#Img_zoom2").data("elevateZoom");
  var currentimg = jQuery("#Img_zoom2");
  console.log(currentimg);
  console.log(ez);
// console.log(ez.getGalleryList());
jQuery.fancybox(ez.getGalleryList());
  return false;
});
jQuery("#carousel2").jcarousel({
scroll:1  
});
}

jQuery(document).ready(function() {
Zoom();
});

';
vmJsApi::addJScript('zoomy',$j);
Title: Re: multi variant custom fields - call scripts after change option
Post by: Studio 42 on March 10, 2016, 09:20:02 AM
Hi,
Your problem is because zoom script is loaded on document ready.
BUt on ajax call, document is already read. So adding any script are not called by ajax.

So to load your script, each time, you have to add it in the productdetails directly, or modify/use the Virtuemart Callback dynupdate javascript.
I proposed to add a custom trigger for some months to solve this problem so you can use external files for eg., but VM dev do not understand it, then for now, it's do all yourself.
Title: Re: multi variant custom fields - call scripts after change option
Post by: caesarsk on March 10, 2016, 17:10:25 PM
thx all for reply.
I understand why this is happening. Insert the whole functions to tmp for me is not an option (using 3 scripts).
I tried to edit a file customfield.php (sublayouts folder) and add scripts (<script></script>) into the call return $html; (I mean multi variant use case 'C'), but... nothing
I try to look at dynamic update.

If anyone will have any solution, I will be very grateful to him

thx again
Title: Re: multi variant custom fields - call scripts after change option
Post by: GJC Web Design on March 10, 2016, 17:31:12 PM
Well... Patrick and I are describing the same solution .. so... IMHO that is the solution..