2

From where is the checkout billing address options drop down being populated? How can I control the options?

EDIT: Found root/vendor/magento/module-checkout/view/frontend/web/js/view/billing-address.js

   var lastSelectedBillingAddress = null,
        newAddressOption = {
            /**
             * Get new address label
             * @returns {String}
             */
            getAddressInline: function () {
                return $t('New Address');
            },
            customerAddressId: null
        },
        countryData = customerData.get('directory-data'),
        addressOptions = addressList().filter(function (address) {
            return address.getType() == 'customer-address'; //eslint-disable-line eqeqeq
        });

addressList then is 'Magento_Customer/js/model/address-list'

Found the template as well root/vendor/magento/module-checkout/view/frontend/web/template/billing-address/list.html

<div class="field field-select-billing">
    <label class="label"><span data-bind="i18n: 'My billing and shipping address are the same'"></span></label>
    <div class="control" data-bind="if: (addressOptions.length > 1)">
        <select class="select" name="billing_address_id" data-bind="
        options: addressOptions,
        optionsText: addressOptionsText,
        value: selectedAddress,
        event: {change: onAddressChange(selectedAddress())};
    "></select>
    </div>
</div>

This is database information so php has to bring it. Where in php are these values passed to knockout?

enter image description here

1 Answer 1

4

I tracked down where the info is passed from php , I started at your file -

Magento_Customer/js/model/address-list

define([
    'ko',
    './customer-addresses'
], function (ko, defaultProvider) {
    'use strict';

    return ko.observableArray(defaultProvider.getAddressItems());
});

the defaultProvider here is /vendor/magento/module-customer/view/frontend/web/js/model/customer-addresses.js it returns the addresses by fetching it from customerData which it gets like this

customerData = window.customerData;

@line 24 . A quick search for "window.customerData" shows it is being assigned from window.checkoutConfig.customerData (vendor/magento/module-checkout/view/frontend/templates/onepage.phtml @line 29)

the window.checkoutConfig is in turn assigned as following

 window.checkoutConfig = <?= /* @escapeNotVerified */ $block->getSerializedCheckoutConfig() ?>;

in vendor/magento/module-checkout/view/frontend/templates/onepage.phtml @line 26

so this is the point where the php passes the customerData and hence address info along with it to knockout , specifically window.customerData which is accessible to ko.

You can further extend the trace by following vendor/magento/module-checkout/Block/Onepage.php's getSerializedCheckoutConfig() function.

2
  • vivek i want to billing address in dropdown list this not working... Commented Mar 26, 2019 at 4:41
  • hi @Vivek, how the default billing address is preselected in the drop down options Commented Mar 15, 2021 at 9:07

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.