2

I see that following code from shipping-information template is used to display shipping address on checkout#payment page but unable to understand which Magento 2 PhP Model or knockout view model is getting this data. I know that this data comes from address tables but what I would like to understand is the middle man that's getting the data since I see the DB table and fronte-end code, but not the code that's fetching it.

<!-- ko foreach: getRegion('ship-to') -->
    <!-- ko template: getTemplate() -->
    <!--/ko-->
<!--/ko-->

Any clues gurus?

Alan Storm has a good to post to understand what's going on from shipping to payment page, which is very helpful in case anyone needs it.

Magento 2 checkout - Shipping to Payment

Improve this question
5
  • I hope it helps! inviqa.com/blog/using-knockout-js-magento-2
    – Chirag Patel
    Mar 30, 2019 at 12:15
  • cloudways.com/blog/knockoutjs-in-magento-2
    – Chirag Patel
    Mar 30, 2019 at 12:15
  • Thanks Chirag. I read through above posts and I do understand how knockoutjs bindings are working for given examples, but I don't see similar code for this Magento 2 scenario. Am I missing anything? Please comment if you know OOB Magento 2 code that's responsible for this since I couldn't find it.
    – cnu
    Apr 1, 2019 at 13:58
  • Do you want to know how template binding works in general or its core implementation?
    – Vivek Kumar
    Apr 2, 2019 at 13:04
  • I would like to know where to find the implementation for 'ship-to' address view model code in OOB Magento 2.2.x code to fix a bug we have when displaying the shipping address.
    – cnu
    Apr 2, 2019 at 17:35

1 Answer 1

Reset to default
1 
<!-- 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: []
        },

Please feel free to ask any questions.

EDIT :

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.

Improve this answer
3
  • this is great information, I kind of got it but my understanding is much better now. At the end what I am trying to understand is the helper or Block that's getting 'ship-to' address information from the DB. Any idea on which code is doing in OOB Magento 2 code?
    – cnu
    Apr 4, 2019 at 16:51
  • the linked Q&A certainly helped to understand OOB Magento address flow. Here is the issue I am running into magento.stackexchange.com/questions/267160/…, any idea on how to extend customerdata address data for this scenario to display quote address data instead of customer address book addresses when browser is refreshed?
    – cnu
    Apr 11, 2019 at 2:44
  • tried few things but still unable to find root cause for the refresh issue.
    – cnu
    Apr 21, 2019 at 23:48

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.