8

Shipping address is displayed using below knockout js code.
I am having a hard time finding the back-end code that's setting data for getRegion('ship-to') function even though I could see the UI JS template component configuration. Does anyone have any input on how this data is being pulled on the payment/review page in Magento 2.x?

<!-- ko foreach: getRegion('ship-to') -->
    <!-- ko template: getTemplate() -->
    <!--/ko-->
<!--/ko-->
Improve this question
1
  • Please check my answer and do let me know if it helps.
    – Vivek Kumar
    Apr 9, 2019 at 17:27

2 Answers 2

Reset to default
6 
<!-- ko foreach: getRegion('ship-to') -->

invokes the following piece of code from checkout_index_index.xml layout file

<item name="displayArea" xsi:type="string">shipping-information</item>
<item name="children" xsi:type="array">
    <item name="ship-to" xsi:type="array">
        <item name="component" xsi:type="string">Magento_Checkout/js/view/shipping-information/list</item>
        <item name="displayArea" xsi:type="string">ship-to</item>
    </item>
</item>

It essentially asks to load uiComponent corresponding to the region i.e Magento_Checkout/js/view/shipping-information/list and loop and render through all its children.

<!-- ko template: getTemplate() -->

renders HTML templates corresponding to each component, you can know template for a uiComponent by looking into its code. For eg. for current uiComponent i.e Magento_Checkout/view/frontend/web/js/view/shipping-address/list.js following code tells us that the template for it is Magento_Checkout/shipping-address/list.html located under view/frontend/web/template/shipping-address directory.

return Component.extend({
        defaults: {
            template: 'Magento_Checkout/shipping-address/list',
            visible: addressList().length > 0,
            rendererTemplates: []
        },

All the addresses are maintained in a global js window object called customerData, if you specifically want to know how data is coming from php. This answer of mine might help.

Please feel free to ask any questions.

Improve this answer
1

shipping-information.html checkout template is being pulled by:

vendor > magento > module-checkout > view > frontend > web > js > view > shipping-information.js

If you will notice, in that template there is a class shipping-information-content under the class ship-via wherein data are bind from shipping-information.js method.

EDIT:
ship-to data are pulled from shipping information address renderer. Check this template file:

vendor > magento > module-checkout > view > frontend > web > template > shipping-information > address-renderer > default.html

Improve this answer
10
  • thanks for the response. I do see the template and shipping-information.js. There I don't see any methods for getting 'ship-to' region/component data but I do see getShippingMethodTitle(), backtoShippingMethod(), and back() functions. Am I missing anything here since I don't see 'ship-to' view model?
    – cnu
    Mar 26, 2019 at 23:16
  • I can't check it for now because I'm using a mobile phone. but as far as I know, the ship-to region pertains to the block where shipping-information contents will bind and be displayed
    – fmsthird
    Mar 27, 2019 at 0:22
  • when I say block, I mean to say is a div block
    – fmsthird
    Mar 27, 2019 at 0:22
  • I grepped for 'ship-to' under vendor/ and app/ and don't see it anywhere else other than /module-checkout/view/frontend/layout/checkout_index_index.xml and in shipping-information.html. Not sure which view-model is getting this data.
    – cnu
    Mar 27, 2019 at 1:32
  • ah it is with the address renderer
    – fmsthird
    Mar 27, 2019 at 3:11

Your Answer

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

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