Metafields values doesn't loaded in to javascript

Technical Q&A
,
1

Hello,

I have two fields with entries: Start Time (integer) and End Time (integer).

I want to disable the “Order” button on a product page.

In the console, I only see the default values.

Here is a script. I’m using it in “theme liquid” file.

Doesn’t matter what I’m using “product metafields …” or “shop metafields”

document.addEventListener('DOMContentLoaded', function() {
    var orderButton = document.getElementById('ProductSubmitButton-template--23907597549899__main');
    var metafieldData = {
        startHour: "{{ shop.metafields.product_button.start | default: 10 }}",
        endHour: "{{ shop.metafields.product_button.end | default: 20 }}"
    };

    console.log('Start Hour:', metafieldData.startHour);
    console.log('End Hour:', metafieldData.endHour);

    function checkOrderTime() {
        var currentHour = new Date().getHours();
        console.log('Current Hour:', currentHour);

        if (currentHour < metafieldData.startHour || currentHour >= metafieldData.endHour) {
            if (orderButton) {
                orderButton.disabled = true;
                orderButton.style.opacity = '0.5';
                orderButton.title = '' + metafieldData.startHour + ':00 - ' + metafieldData.endHour + ':00';
            }
        } else {
            if (orderButton) {
                orderButton.disabled = false;
                orderButton.style.opacity = '1';
                orderButton.title = '';
            }
        }
    }

    checkOrderTime();
});
2

I reduced your script a bit to include only the metafields without the order button logic, and it works for me. The code below outputs my stored values from product.metafields.product_button.start and .end to console, and returns default when I remove them.

But I see you’re using product.metafields for start and shop.metafields for end. Could there be a mixup in where you have input the metadata so it can’t find it and falls back to the default setting? Have you checked that the variables are in product metafields and not variant metafields etc. :slightly_smiling_face:

3

Thank you for your response and help.

I changed the code to use “shop metafields…” for both start and end, but it didn’t work. The values are not being retrieved, and it falls back to the default settings. I’ve double-checked that the variables are set in the shop metafields, but the issue persists. Any suggestions on what might be going wrong? :blush: