2

I want to disable the "Place Order" button in certain conditions.
I have tried a lot but not getting exact information.
Give some idea for same

  • What have you tried ? In which conditions you want to disable ? – Narendra Vyas Mar 18 '19 at 13:09
2

It wont be as easy to hide "Place Order" button directly because it comes separate with each payment method.

You can override individual payment method module's form.html (e.g. for Braintree : vendor/magento/module-braintree/view/frontend/web/template/payment/form.html) file but in this case also there are N no of payments you will have to do for all.

Hence, I would recommend to go through following steps:

  1. Create a button same as "Place Order"
  2. Hide default "Place Order" by CSS
  3. Trigger default "Place Order" on the click of your custom "Place Order" button
  4. You can apply any condition on your custom "Place Order" button

Have a look at this link in order to achieve above :

https://zanetabaran.com/how-to-in-magento-2-how-to-move-checkout-buttons-to-order-summary-only-on-desktop/amp/

| improve this answer | |
  • Thanks, it works fine. – Deepak Shinde Mar 20 '19 at 17:31
  • @deepak glad that you made it done, please accept the answer and also up vote so that it may help others also. Thanks. – Narendra Vyas Mar 20 '19 at 18:06
  • @NarendraVyas I am trying to achieve similar behavior but in our case we need to disable the button for customers based on customer group data and display a message instead of the button. How do we access session/customer data inside .js file as mentioned at zanetabaran.com post? – cnu Apr 5 '19 at 18:51
  • you can use magento customer-data.js, you can include that in js file. – Narendra Vyas Apr 6 '19 at 12:21
1

You can create a js file and include it on checkout page with following code.

define(['jquery'], function($) {
    $(document).on('change', 'input[name="payment[method]"]', function() {
        if(!your_condition)
        {
            $('button.checkout').attr('disabled', 'disabled');
        }
    });
});

This should work.

| improve this answer | |
0

Override the below template in your theme

vendor/magento/module-braintree/view/frontend/web/template/payment/form.html

After that update code from line no 139 to 149 with given below code

<button class="action primary checkout"
        type="submit"
        data-bind="
            click: placeOrderClick,
            attr: {title: $t('Place Order')},
            css: {disabled: !isPlaceOrderActionAllowed()},
            enable: isActive()
        "
        disabled>
    <span data-bind="i18n: 'Place Order'"></span>
</button>
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.