When customizing checkout page, I want to add new custom js to check when a specific Payment is checked. Can I use Knockout Js or re-use exist js functions of payment? And, what's the best practice for this?
asked May 20, 2016 at 4:38
Khoa Truong
32.5k11 gold badges91 silver badges159 bronze badges
-
devdocs.magento.com/guides/v2.0/howdoi/checkout/…Daniel Ifrim– Daniel Ifrim2016年05月22日 08:05:38 +00:00Commented May 22, 2016 at 8:05
-
See this tutorial also: oyenetwork.com/articles/…Daniel Ifrim– Daniel Ifrim2016年05月22日 08:08:06 +00:00Commented May 22, 2016 at 8:08
2 Answers 2
There is a way to do this. We're going to override the core js.
If we inspect the element of payment checkbox, as we can see, Magento uses a function - selectPaymentMethod - to check select action. We will override this core function.
In your custom module, create requirejs-config.js which declares our override function.
var config = {
map: {
'*': {
'Magento_Checkout/js/action/select-payment-method':
'Boolfly_PaymentFee/js/action/payment/select-payment-method'
}
}
};
For example, our override function:
define(
[
'jquery',
'ko',
'Magento_Checkout/js/model/quote',
'Boolfly_PaymentFee/js/action/checkout/cart/totals',
'jquery/jquery-storageapi',
],
function(,ドル ko ,quote, totals) {
'use strict';
return function (paymentMethod) {
//Our custom code should be here.
if(paymentMethod.method == 'paymentfee')
{
alert('Payment Fee');
quote.paymentMethod(paymentMethod);
} else {
quote.paymentMethod(paymentMethod);
}
}
}
);
I'm not sure about the best way to tackle my problem. However, this way can resolve it.
answered May 29, 2016 at 4:56
Khoa Truong
32.5k11 gold badges91 silver badges159 bronze badges
Why not add an by extending checkout_index_index.xml which you should add to
/app/design/frontend/<vendor>/<themename>/Magento_Checkout/layout/
adding the follwing:
<head>
<link src="<url of your js file>"/>
</head>
answered May 22, 2016 at 6:50
Kay Int Veen
1,5132 gold badges15 silver badges27 bronze badges
-
You didn't fully understand my question:
Can I use Knockout Js? And, what's the best practice for this?.Khoa Truong– Khoa Truong2016年05月22日 06:57:18 +00:00Commented May 22, 2016 at 6:57 -
Sorry about that but in fact, now you can add a new knockout file to your checkout right ;-)Kay Int Veen– Kay Int Veen2016年05月22日 07:47:29 +00:00Commented May 22, 2016 at 7:47
-
Can i re-use exist js functions of payment? When I don't want to use
checkout_index_index.xmlto add new custom js.Khoa Truong– Khoa Truong2016年05月22日 07:58:17 +00:00Commented May 22, 2016 at 7:58
default