0

I want to show only 5 shipping address on this page, followed this below link Magento 2 - Checkout. Remove “New Address” button from billing/shipping address with module or theme. enter image description here

/app/design/frontend/VendorName/ThemeName/Magento_Checkout/web/js/view/shipping.js

// this.isNewAddressAdded(hasNewAddress);
            if (addressList().length <= 5) {
                    this.isNewAddressAdded(true);
                }

I've added mixin this way /app/code/Vendor/Checkout/view/frontend/requirejs-config.js

var config = {
    config: {
        mixins: {
            'Magento_Checkout/js/view/shipping': {
                'Vendor_Checkout/js/view/shipping': true
            },
        }
    }
};

1 Answer 1

1

You need to modify isNewAddressAdded() logic in shipping.js. The following code will help you.

if (addressList().length >= 5) {
    this.isNewAddressAdded(true);
}

Update:

if (addressList().length >= 5) {
            this.isNewAddressAdded(true);
        } else {
            this.isNewAddressAdded(hasNewAddress);
        }

[Update (2021-07-12)]

Add following code snippet on shipping.js before initialize method:

isVisibleAddNewAddress:  ko.observable(true),

Now in initialize method add the following code:

var addressCount = parseInt(addressList().length);
if (addressCount >= 5) {
    this.isVisibleAddNewAddress(false);
}

Now open shipping.html add the following code:

<if args="isVisibleAddNewAddress()">
    <button type="button"
            class="action action-show-popup"
            click="showFormPopUp"
            visible="!isNewAddressAdded()">
        <span translate="'New Address'" />
    </button>
</if>

Clear your browser js cache.

10
  • Where I need to put this condition? Jul 9, 2021 at 15:15
  • Create a mixin or copy shipping.js in your theme (github.com/magento/magento2/blob/2.4-develop/app/code/Magento/…), Add above condition in initialize method. E.x the following line: github.com/magento/magento2/blob/2.4-develop/app/code/Magento/…
    – Sohel Rana
    Jul 9, 2021 at 15:19
  • Should I removed the line which is already there "this.isNewAddressAdded(hasNewAddress);" I keep the above code before this line but I can not found any change there? Jul 9, 2021 at 15:44
  • Hi Sohel Thanks for your help after modified the logic still I'm getting the same response, Can you have a look once! // this.isNewAddressAdded(hasNewAddress); if (addressList().length <= 5) { this.isNewAddressAdded(true); } Jul 9, 2021 at 16:46
  • Clear your static content and clear your browser JS cache
    – Sohel Rana
    Jul 10, 2021 at 5:29

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.