Shopify metafields doesn't work with javascript

Technical Q&A
4

Hi Daniel,

Oh, I see. I’ve been playing around with a similar thing on my dev store and ended up creating a hidden block on the product page to keep the variants data in form of a JSON object:

1.png
1.png1853×829 209 KB

And then I was able to access the data in my theme.js file with the following code:

var variantsMetafields =
    jQuery.parseJSON($("#hidden-variant-metafields-container").html());
variantsMetafields.forEach(function(variantMetafield) {
    if (variantMetafield.variant_id == variant.id) {
        $("#hidden-current-variant-metafield").html(variantMetafield.metafield_value);
        $("#hidden-current-variant-metafield").show();
    }
});

That’s definitely not the most elegant solution, but worked for me as a “quick fix” for testing purposes.

Best regards,

Sasha Kachkovskyi

Co-founder and CEO

256 Development

1 Like