2

The Checkout page is currently loading Shipping address as billing and shipping address. I want to load default billing address on checkbox click and set it to order before save. I dont know how to do it.

I tried and found a way to get default billing address through

var defaultBillingAddressese = addressList().filter(function (address) {
            return  address.getType() == 'customer-address' && address.isDefaultBilling();
        });

This line of code returns default billing address now i want to set it to order in billing-address.js.

app/design/frontend/Capitol/luma-child/Magento_Checkout/web/template

    <!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<div class="checkout-billing-address">

    <div class="billing-address-same-as-shipping-block field choice" data-bind="visible: canUseShippingAddress()">
 <input type="checkbox" name="billing-address-same-as-shippings"
                 data-bind="click: updateAddress, attr: {id: 'billing-address-same-as-shippings'}" style="visibility: hidden"/>
        <label data-bind="attr: {for: 'billing-address-same-as-shipping-' + getCode($parent)}" style="visibility: hidden"><span
                data-bind="i18n: 'My billing and shipping address are the same'"></span></label>
    </div>

    <!-- ko template: 'Magento_Checkout/billing-address/details' --><!-- /ko -->
    <fieldset class="fieldset" data-bind="visible: !isAddressDetailsVisible()">
        <!-- ko template: 'Magento_Checkout/billing-address/list' --><!-- /ko -->
        <!-- ko template: 'Magento_Checkout/billing-address/form' --><!-- /ko -->
        <div class="actions-toolbar">
            <div class="primary">
                <button class="action action-update" type="button" data-bind="click: updateAddress">
                    <span data-bind="i18n: 'Update'"></span>
                </button>
                <button class="action action-cancel" type="button" data-bind="click: cancelAddressEdit">
                    <span data-bind="i18n: 'Cancel'"></span>
                </button>
            </div>
        </div>
    </fieldset>

</div>

billing-address.js

updateAddress: function () {
var defaultBillingAddress = addressList().filter(function (address) {
                return  address.getType() == 'customer-address' && address.isDefaultBilling();
            });
           },
2
  • Do you use a custom theme/module ? Have you already tried to develop the feature ? If yes, please and your full code.
    – Vinz
    Commented Sep 23, 2019 at 14:56
  • I'll update my question
    – enayu
    Commented Sep 23, 2019 at 15:00

1 Answer 1

3

You could do the following:

overwrite a default js file checkout-data-resolver.js add extra lines to the applyBillingAddress function to check if default billing address exists and if true to use it.

    var config = {
map: {
    '*': {
        'Magento_Checkout/js/model/checkout-data-resolver': 
    'Vendor_Module/js/model/checkout-data-resolver'        
    }
}

};

in new checkout-data-resolver.js file find applyBillingAddress. Insert following cod after var shippingAddress; and before if (quote.billingAddress())

    ....
var isBillingAddressInitialized;
isBillingAddressInitialized = addressList.some(function (addressFromList) {
  if (addressFromList.isDefaultBilling()) {
     selectBillingAddress(addressFromList);
              return true;
    }

  return false;
 });

if(isBillingAddressInitialized){
                 return;
             }  
....

Reference

1
  • checkout-data-resolver mixin was what I was looking for. This answer helped me. Thanks.
    – Ejaz
    Commented Feb 1, 2023 at 15:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.