0

I am working on magento 2.1.3. I want to uncheck My billing and shipping address are the same checkbox in checkout payment page based on shipping method.

If shipping method is Store Pickup i want to uncheck checkbox by default.

  • Did you find a solution for this? I also want the same, the checkbox to be unchecked on page load. – Geethika Antony Mar 10 '17 at 4:19
  • not yet .... :( – Sudheesh K Surendran Mar 12 '17 at 7:42
  • I am also facing same issue. Is there anyone who found the solution for same. – Bharat Apr 1 '17 at 7:18
  • @SudheeshKSurendran, found any solution? – jafar pinjar May 30 '19 at 12:02
7

Disclaimer: I am an author of an article at the end of this answer.

Magento best practices way.

  1. Create a simple Magento 2 extension.
  2. Create a file app/code/Vendor/Module/view/frontend/requirejs-config.js with the content:

    var config = {
     map: {
     '*': {
       'Magento_Checkout/js/model/checkout-data-resolver': 'Vendor_Module/js/checkout-data-resolver',
       'Magento_Checkout/js/model/shipping-save-processor/default': 'Vendor_Module/js/shipping-save-processor/default'
      }
    }};
    
  3. Copy file vendor/magento/module-checkout/view/frontend/web/js/model/checkout-data-resolver.js to app/code/Vendor/Module/view/frontend/web/js/checkout-data-resolver.js.
  4. Edit file app/code/Vendor/Module/view/frontend/web/js/checkout-data-resolver.js and comment out code around line 231:

        applyBillingAddress: function () {
            var shippingAddress;
    
            if (quote.billingAddress()) {
                selectBillingAddress(quote.billingAddress());
    
                return;
            }
            shippingAddress = quote.shippingAddress();
    
            /*if (shippingAddress &&
                shippingAddress.canUseForBilling() &&
                (shippingAddress.isDefaultShipping() || !quote.isVirtual())
            ) {
                selectBillingAddress(quote.shippingAddress());
            }*/
        }
    };
    
  5. Copy file vendor/magento/module-checkout/view/frontend/web/js/model/shipping-save-processor/default.js to app/code/Vendor/Module/view/frontend/web/js/shipping-save-processor/default.js.

  6. In app/code/Vendor/Module/view/frontend/web/js/shipping-save-processor/default.js comment out code around line 34:

    saveShippingInformation: function () {
    var payload;
    
    /*if (!quote.billingAddress()) {
        selectBillingAddressAction(quote.shippingAddress());
    }*/
    
    payload = {
    
  7. Delete folder pub/static/frontend:

     rm -rf pub/static/frontend
    
  8. Regenerate static content:

     php bin/magento setup:static-content:deploy
    
  9. Clear magento cache and you are all set.

Dirty way

Instead of steps 1 through 6 simply edit the file vendor/magento/module-checkout/view/frontend/web/js/model/checkout-data-resolver.js and comment out code around line 231 as in step 4 and edit the file vendor/magento/module-checkout/view/frontend/web/js/model/shipping-save-processor/default.js and comment code code around line 34 as in step 6.

Repeat steps 7,8,9.

Originally published as https://www.goivvy.com/blog/magento-2-set-billing-shipping-address-unchecked-default-checkout

|improve this answer|||||
  • Unable to make it work in 2.2.3. Anyway you can look in to it? Thank you – crashtestxxx Mar 25 '18 at 12:14
  • Does not work on 2.1.12 – gabehou Apr 21 '18 at 2:51
  • the question is need to uncheck based on the shipping method – jafar pinjar May 30 '19 at 11:58
5

Just copy this file in your theme : vendor/magento/module-checkout/view/frontend/web/js/view/billing-address.js

Checkbox on the payment section depends on this js variable 'isAddressSameAsShipping' which is define in above file.

  this._super()
                .observe({
                    selectedAddress: null,
                    isAddressDetailsVisible: quote.billingAddress() != null,
                    isAddressFormVisible: !customer.isLoggedIn() || addressOptions.length === 1,
                    isAddressSameAsShipping: false,
                    saveInAddressBook: 1
                });

By default, the variable is false, but this function change the value of this variable from false to true, if quote is not Virtual:

  quote.billingAddress.subscribe(function (newAddress) {
            if (quote.isVirtual()) {
                this.isAddressSameAsShipping(false);
            } else {
                this.isAddressSameAsShipping(
                    newAddress != null &&
                    newAddress.getCacheKey() == quote.shippingAddress().getCacheKey()  //return true
                );
            }

            if (newAddress != null && newAddress.saveInAddressBook !== undefined) {
                this.saveInAddressBook(newAddress.saveInAddressBook);
            } else {
                this.saveInAddressBook(1);
            }
            this.isAddressDetailsVisible(true);
        }, this);

Just change above 'initObservable' function like following:

    initObservable: function () {
        this._super()
            .observe({
                selectedAddress: null,
                isAddressDetailsVisible: quote.billingAddress() != null,
                isAddressFormVisible: !customer.isLoggedIn() || addressOptions.length === 1,
                isAddressSameAsShipping: false,
                saveInAddressBook: 1
            });
        quote.billingAddress.subscribe(function (newAddress) {
            if (quote.isVirtual()) {
                this.isAddressSameAsShipping(false);
            } 
            if (newAddress != null && newAddress.saveInAddressBook !== undefined) {
                this.saveInAddressBook(newAddress.saveInAddressBook);
            } else {
                this.saveInAddressBook(1);
            }
            this.isAddressDetailsVisible(true);
        }, this);
        return this;
    },
|improve this answer|||||
  • Can you please explain this code , how it is different then default code ? – Hamendra Sunthwal 13 hours ago
  • 1
    You need to add this just start of function: this._super() .observe({ selectedAddress: null, isAddressDetailsVisible: quote.billingAddress() != null, isAddressFormVisible: !customer.isLoggedIn() || addressOptions.length === 1, isAddressSameAsShipping: false, saveInAddressBook: 1 }); – D Singh 13 hours ago
  • do i need to add this "this._super() .observe({ selectedAddress: null, isAddressDetailsVisible: quote.billingAddress() != null, isAddressFormVisible: !customer.isLoggedIn() || addressOptions.length === 1, isAddressSameAsShipping: false, saveInAddressBook: 1 });" code seperately in "initialize: function " function? – Hamendra Sunthwal 13 hours ago
  • Yes add this in initObservable/ initialize function – D Singh 12 hours ago

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.