3

I want to display a custom field in "cash on delivery" payment method. I have created a custom module for this. But the field displays in all payment methods. Here is my code html

<div class="payment-option opc-payment-additional rpo last" data-bind="fadeVisible: rpoVisible">
    <div class="payment-option-title field choice">          
            <span data-bind="i18n: 'RPO? (Optional)'"></span>
    </div>
    <div class="payment-option-content" data-role="content">
        <div class="field">        
            <div class="control">                           
                <input type="text" id="referencepo-code" name="referencepo-code" value="" maxlength="16" />
            </div>
        </div>
    </div>    
</div>

JS file

define(
    [
        'jquery',
        'uiComponent',
        'knockout',
        'Magento_Checkout/js/model/quote'
    ],
    function ($, Component, ko,quote) {
        'use strict';


        return Component.extend({
            defaults: {
                template: 'NameSpace_Module/checkout/order-rpo-block'
            },
            initialize: function() {
                this._super();
                var self = this;
                self.rpoVisible = ko.observable(false);

                quote.paymentMethod.subscribe(function(method){
                     if(method.method == 'cashondelivery'){
                        self.rpoVisible = true;
                        console.log(method.method);
                    }else{
                        self.rpoVisible = false;
                    }
                }, null, 'change');



            },

        });
    }
);

Using this I got the payment method selection. But it is visibile in all payment methods. Please help me to resolve the issues.

Reference: Magento 2 : Event Observer For Payment Method Selection

Your Answer

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

Browse other questions tagged or ask your own question.