0

I have created one custom icon in checkout page below payment methods.

My Requirement:

If I click the icon, the payment methods should be unchecked. After that, the customer needs to click the payment method to place an order.

Please provide me with a solution. My custom js for custom icon

newValue is a boolean value (icon click true or false)

initObservable: function () {
            var self = this;

            this._super()
                    .observe({
                        CheckVal: false // While clicking the icon it comes here whether it is true or false
                    });

            this.CheckVal.subscribe(function (newValue) {
                if (newValue) {
                    self.customicon(newValue);
                } else {
                    self.customicon(newValue);
                }
            });

            return this;
        },
        customicon: function (newValue) {
            var self = this;
            var isLoading = ko.observable(false);
            var isApplied = ko.observable(false);

            self.ajaxCall(isLoading, newValue, isApplied);

        },
        ajaxCall: function (isLoading, newValue, isApplied) {
            if (newValue) {
                var iconvalue = 1;
            } else {
                var iconvalue = 0;
            }
            var serviceUrl = urlBuilder.build('x/y/z');
            fullScreenLoader.startLoader();
            jQuery.ajax({
                url: serviceUrl,
                type: "POST",
                data: {iconvalue: iconvalue},
                success: function (response) {
                    if (response) {
                        var deferred = $.Deferred();
                        fullScreenLoader.stopLoader();
                        //For, When click customicon, reset payment methods
                        quote.setPaymentMethod();
                        //For refresh payment section
                        getPaymentInformation(deferred);
                        jQuery.when(deferred).done(function () {
                            isApplied(false);
                            totals.isLoading(false);
                        });

                        totals.isLoading(true);
                    }
                }, error: function (error) {
                    isLoading(false);
                }
            });
  • Share your code here so we can get more idea about your fault or bug. – Nikunj Vadariya Jun 8 '18 at 6:08
  • Hi Nikunj, I have shared my js – Jaisa Jun 8 '18 at 6:26

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.