fetch variant image and display in stick add to cart bar

fetch variant image and display in stick add to cart bar

CyberdyneJoule
Excursionist
16 0 4

I am using following javascript  to get a variant from variant_id. From the script below, I could get response as variant.product_variant in debug console. Problem is the varaint object does not have .image attribute or .image.src attribute and i want the image of the variant to display in .stick-bar-thumb-thumb container. Any help on how to get variant image via javascript or any modification to below code? Thaks

 

 

 

unction updateThumbnailImage(variantId) {
  // Construct the URL to fetch variant information
  var variantUrl = '/variants/' + variantId + '.json';

  // Fetch the variant data using AJAX
  fetch(variantUrl)
    .then(function (response) {
      return response.json();
    })
    .then(function (variant) {
      if (variant && variant.image) {
        // Get the URL of the variant's image
        var imageUrl = variant.image.src;

        // Select the element with the class .sticky-bar-thumb-thumb
        var thumbImageElement = document.querySelector('.sticky-bar-thumb-thumb');

        // Update the src attribute of the image element
        thumbImageElement.src=imageUrl;
      }
    })
    .catch(function (error) {
      console.error('Error fetching variant data:', error);
    });

 

 

 

Replies 0 (0)