Easystore Hide Proceed To Payment Button When Order Amount is Lower Than .... - Question | JoomShaper
SP Page Builder 6 is Here! Learn More →

Easystore Hide Proceed To Payment Button When Order Amount is Lower Than ....

J

justmikey

EasyStore 8 months ago

I want to have a short code or something to 'hide' the PROCEED TO PAYMENT button when a order is below € 10.000,00 on checkout page.

Is that possible? Maybe with CSS or hardcoded? Pls help, very needed.

0
24 Answers
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 8 months ago #183865

Apolozy for the inconvenience. Unfortunately, there is no built-in setting to achieve this. However, it is possible to implement this using custom JavaScript by dynamically checking the order total and hiding the "Proceed to Payment" button if the amount is below a value. Please add the following JS code to your Template Options -> Custom Code -> Custom JS

document.addEventListener("DOMContentLoaded", function () {
    function updateButtonState() {
        let priceElement = document.querySelector(".easystore-list-value");
        let button = document.querySelector(".btn.btn-primary.btn-lg.w-100.mb-4");

        if (priceElement && button) {
            let priceText = priceElement.textContent.trim().replace(/[^0-9.]/g, ''); // Remove non-numeric characters
            let price = parseFloat(priceText);

            if (!isNaN(price) && price < 200) {
                button.setAttribute("disabled", "disabled"); // Disable button
                button.style.display = "none"; // Hide button
            } else {
                button.removeAttribute("disabled"); // Enable button
                button.style.display = ""; // Show button
            }
        }
    }

    updateButtonState(); // Run once on load

    const observer = new MutationObserver(updateButtonState);
    let targetNode = document.querySelector(".easystore-list-value");

    if (targetNode) {
        observer.observe(targetNode, { childList: true, subtree: true, characterData: true });
    }
});

Replace the '200' value according to your preference

0
J
justmikey
Accepted Answer
8 months ago #183929

Hi,thank you. gonna try that. Can i also add a rule with text 'proceding not possible below € ... " when amount is below our minimal amount ?

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 8 months ago #183945

You can try this one.

document.addEventListener("DOMContentLoaded", function () {
    function updateButtonState() {
        let priceElement = document.querySelector(".easystore-list-value");
        let button = document.querySelector(".btn.btn-primary.btn-lg.w-100.mb-4");

        if (priceElement && button) {
            let priceText = priceElement.textContent.trim().replace(/[^0-9.]/g, ''); // Remove non-numeric characters
            let price = parseFloat(priceText);

            if (!isNaN(price) && price < 200) {
                button.setAttribute("disabled", "disabled"); // Disable button
                button.textContent = "Proceeding Not Possible Below €200"; // Change text
            } else {
                button.removeAttribute("disabled"); // Enable button
                button.textContent = "Proceed to Payment"; // Restore original text
            }
        }
    }

    updateButtonState(); 


    const observer = new MutationObserver(updateButtonState);
    let targetNode = document.querySelector(".easystore-list-value");

    if (targetNode) {
        observer.observe(targetNode, { childList: true, subtree: true, characterData: true });
    }
});

Replace 200 with your desire price. Please use integer value.

0
J
justmikey
Accepted Answer
8 months ago #183994

It doesnt work well... I changed the parameter to 10000.

Now,

  • below € 100 order the button is disabled
  • After € 100 - € 1000 button enabled
  • After € 1000 button disabled, even after € 10.000 it is still disabled... Don't understand.

Just curious ---> Is there also a 'small ' code for a seperate (none button) text BELOW the button where stands: you need to order € xxx more to pass the € 10.000 limit? Would be great!!

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 8 months ago #184006

Hi there!

Thank you for bringing this to our attention, and I sincerely apologize for the inconvenience caused.

To assist you more effectively, may I kindly request temporary administrative access to your site? This will allow me to thoroughly investigate and resolve the issue for you.

Before sharing the credentials, I strongly recommend taking a complete backup of your site to ensure all data remains secure.

Looking forward to your response.

Best regards

0
J
justmikey
Accepted Answer
8 months ago #184090

seehidden

0
J
justmikey
Accepted Answer
8 months ago #184136

Hello, any idea how to fix?

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #184164

I apologize for the inconvenience and the delayed response due to the weekend. I am currently working on your issue and would appreciate your confirmation on the minimum price you would like to set.

Looking forward to your response.

0
J
justmikey
Accepted Answer
7 months ago #184200

Amount is 10.000€ Lower than 10.000 not possible to order Highter than 10.000 possible

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #184209

Apolozy for the inconvenience. I’m a bit confused due to the difference in numbering formats. Could you please confirm whether you mean 10k or 10 without the separator? This will help us ensure accurate processing.

0
J
justmikey
Accepted Answer
7 months ago #184220

10000 euro. But the website is changing the values to 10.000 itselfs because of seperator. That is always in EUR.

x.xxx,xx thousands xxx,xx hundreds

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #184231

Please provide your site super user access

0
J
justmikey
Accepted Answer
7 months ago #184238

I have changed.

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #184257

You said it worked partially before, could you please put the code which worked partially?

0
J
justmikey
Accepted Answer
7 months ago #184260

See hidden

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #184268

Could you confirm is it partially working?

But it only work between 100 and 1000 euro for what i've tested. Doesnt work anymore after 1000>. Ofcourse changed the 200 value to 10000.

0
J
justmikey
Accepted Answer
7 months ago #184352

No, when set to 10.000 the button to proceed to payment still appears < 1000€. After € 1000 it disappears and after 10.000 it is still dissapeared.

So the button needs to be disappeared between 0 and 10.000€....

0
J
justmikey
Accepted Answer
7 months ago #184596

Do you have any idea? Why it partly work?

0
J
justmikey
Accepted Answer
7 months ago #185403

Hello any updates?

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #185523

Please try this code

document.addEventListener("DOMContentLoaded", function () {
    function updateButtonState() {
        let priceElement = document.querySelector(".easystore-list-value");
        let button = document.querySelector(".btn.btn-primary.btn-lg.w-100.mb-4");

        if (priceElement && button) {
            let priceText = priceElement.textContent.trim()
                .replace(/\./g, '')     // Remove thousand separators (dots)
                .replace(/,/g, '.');    // Replace decimal separator (comma) with dot

            let price = parseFloat(priceText);

            if (!isNaN(price) && price < 200) {
                button.setAttribute("disabled", "disabled"); // Disable button
                button.textContent = "Proceeding Not Possible Below €200"; // Change text
            } else {
                button.removeAttribute("disabled"); // Enable button
                button.textContent = "Proceed to Payment"; // Restore original text
            }
        }
    }

    updateButtonState();

    const observer = new MutationObserver(updateButtonState);
    let targetNode = document.querySelector(".easystore-list-value");

    if (targetNode) {
        observer.observe(targetNode, { childList: true, subtree: true, characterData: true });
    }
});
0
J
justmikey
Accepted Answer
7 months ago #185688

No, same problem... :(

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #185706

Try this code

document.addEventListener("DOMContentLoaded", function () {
    function updateButtonState() {
        let priceElement = document.querySelector(".easystore-list-value");
        let button = document.querySelector(".btn.btn-primary.btn-lg.w-100.mb-4");

        if (priceElement && button) {
            let priceText = priceElement.textContent.trim();

            // Convert European format to a standard numeric format
            priceText = priceText.replace(/\./g, ''); // Remove thousand separator (dots)
            priceText = priceText.split(',')[0]; // Keep only the integer part before the comma

            let price = parseInt(priceText, 10); // Convert to integer

            if (!isNaN(price) && price < 200) {
                button.setAttribute("disabled", "disabled"); // Disable button
                button.textContent = "Proceeding Not Possible Below 200"; // Change text
            } else {
                button.removeAttribute("disabled"); // Enable button
                button.textContent = "Proceed to Payment"; // Restore original text
            }
        }
    }

    updateButtonState(); // Run once on load

    // Monitor changes to the total price (for cases where it updates dynamically)
    const observer = new MutationObserver(updateButtonState);
    let targetNode = document.querySelector(".easystore-list-value");

    if (targetNode) {
        observer.observe(targetNode, { childList: true, subtree: true, characterData: true });
    }
});
0
J
justmikey
Accepted Answer
7 months ago #186312

Does not work.

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 7 months ago #186863

Apologies for the inconvenience and the delayed response. I have discussed the issue with our development team, and unfortunately, it is not achievable at the moment. However, I have added it as a feature request, and it will be considered for a future update. Thank you for your patience and understanding.

0