2

I have some validations to place order through custom TestPayment method, for this I have to disable/enable the PlaceOrder button and showing some message under my custom payment method section. For this I have created the custom payment method and it is showing and working fine. But I don't know to to validate and showing messages here.

enter image description here

So Could you please suggest me how to showing messages and enable/disable PlaceOrder Button here based on customer Data.

TestVendor/TestPayment/view/frontend/web/js/view/payment/method-renderer/testpayment-method.js

/*browser:true*/
/*global define*/
define(
    [
        'Magento_Checkout/js/view/payment/default',
        'Magento_Customer/js/customer-data',
        'Magento_Checkout/js/model/quote',
        'jquery'
    ],
    function (Component, customer, quote, $) {
        'use strict';

        var customer_Data;

        return Component.extend({

            defaults: {
                template: 'TestVendor_TestPayment/payment/testpayment'
            },

            /** Returns send check to info */
            getMailingAddress: function() {
                return window.checkoutConfig.payment.checkmo.mailingAddress;
            },
            isDisplayed:function () {

                console.log(customer);
                console.log(customer.customer);
                console.log(customer_Data);
                var total = quote.getTotals();
                console.log(total);
                console.log(quote.billingAddress);

                return false;
            }

        });
    }
);

after debugging not getting data.

enter image description here

2
  • how to show msg in cod payment method
    – Mahi M
    Mar 1 '18 at 10:39
  • @PriyaM see below answer it worked for me.
    – Bojjaiah
    Mar 5 '18 at 9:57
2

Try follwoing way:

TestVendor/TestPayment/view/frontend/web/js/view/payment/method-renderer/testpayment-method.js

/*browser:true*/
/*global define*/
define(
    [
        'Magento_Checkout/js/view/payment/default',
        'Magento_Customer/js/customer-data',
        'Magento_Checkout/js/model/quote'
    ],
    function (Component, customerData, quote) {
        'use strict';

        return Component.extend({
            defaults: {
                template: 'TestVendor_TestPayment/payment/testpayment'
            },

            /** Returns send check to info */
            getMailingAddress: function() {
                return window.checkoutConfig.payment.checkmo.mailingAddress;
            },
            isDisplayed:function () {
                var customer = customerData.get('customer');
                console.log(customer().firstname);

                var totals = quote.getTotals()();
                var grand_total;
                if (totals) {
                    grand_total = totals.grand_total;
                } else {
                    grand_total = quote.grand_total;
                }

                console.log(grand_total);
                return true;
            }

        });
    }
);

TestVendor/TestPayment/view/frontend/web/template/payment/testpayment.html

<div class="payment-method" data-bind="css: {'_active': (getCode() == isChecked())}">
    <div class="payment-method-title field choice">
        <input type="radio"
               name="payment[method]"
               class="radio"
               data-bind="attr: {'id': getCode()}, value: getCode(), checked: isChecked, click: selectPaymentMethod, visible: isRadioButtonVisible()"/>
        <label data-bind="attr: {'for': getCode()}" class="label"><span data-bind="text: getTitle()"></span></label>
    </div>
    <div class="payment-method-content">
        <!-- ko foreach: getRegion('messages') -->
        <!-- ko template: getTemplate() --><!-- /ko -->
        <!--/ko-->
        <div class="payment-method-billing-address">
            <!-- ko foreach: $parent.getRegion(getBillingAddressFormName()) -->
            <!-- ko template: getTemplate() --><!-- /ko -->
            <!--/ko-->
        </div>
        <div class="checkout-agreements-block">
            <!-- ko foreach: $parent.getRegion('before-place-order') -->
            <!-- ko template: getTemplate() --><!-- /ko -->
            <!--/ko-->
        </div>
        <div class="actions-toolbar">
            <div class="primary">
                <!-- ko if: isDisplayed() -->
                <button class="action primary checkout"
                        type="submit"
                        data-bind="
                        click: placeOrder,
                        attr: {title: $t('Place Order')},
                        css: {disabled: !isPlaceOrderActionAllowed()},
                        enable: (getCode() == isChecked())
                        "
                        disabled>
                    <span data-bind="i18n: 'Place Order'">
                </button>
                <!-- /ko -->
            </div>
        </div>
    </div>
</div>

Run following command

php bin/magento setup:static-content:deploy

Clear cache.

11
  • working fine. <!-- ko if: isDisplayed() --> and <!-- /ko --> this means code is commented right? then how it working?
    – Bojjaiah
    Dec 14 '16 at 9:10
  • 1
    This html file render using knockoutJs, <!-- ko if: isDisplayed() --> ... <!-- /ko --> is a if statement of knockoutJs.
    – Sohel Rana
    Dec 14 '16 at 9:22
  • Great. sound like charm!. if I want to display message. how to append message to div or any other control/element here (.js to .html)?
    – Bojjaiah
    Dec 14 '16 at 9:27
  • 2
    you can normal jquery operation. example: define( [ 'Magento_Checkout/js/view/payment/default', 'jquery' ], function (Component, $) {}
    – Sohel Rana
    Dec 14 '16 at 9:31
  • I will try. but I have updated my thread for how getting customer data. Is it correct way or ? please suggest me. how to get customer data and order total here?
    – Bojjaiah
    Dec 14 '16 at 9:36

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.