As checkout page layout is mostly build in knockout.js and I have zero knowledge of knockout.js.

I want to show shipping address in select box <select> instead of Box (ref to image - section 1) on the checkout page.

In Billing address it is showing as select box (ref to image - section 2), but I want same display for shipping address.

any help is appreciable.

enter image description here

  • Are you found any solution Commented Jun 15, 2017 at 11:22

1 Answer 1


You have to override





<!-- ko if: (visible)-->
<div class="field addresses">
  <div class="control">
        <!-- ko foreach: { data: elems, as: 'element' } -->
        <!-- ko template: element.getTemplate() --><!-- /ko -->
        <!-- /ko -->
<!-- /ko -->

or default.html

  <!-- ko text: address().firstname --><!-- /ko --> <!-- ko text: address().lastname --><!-- /ko --><br/>
  <!-- ko text: address().street --><!-- /ko --><br/>
  <!-- ko text: address().city --><!-- /ko -->, <!-- ko text: address().region --><!-- /ko --> <!-- ko text: address().postcode --><!-- /ko --><br/>
  <!-- ko text: getCountryName(address().countryId) --><!-- /ko --><br/>
  <!-- ko text: address().telephone --><!-- /ko --><br/>

this will display you an shipping address in dropdown, but i don't about how to set selection event for shipping address as of billing address, for that may be you have to look at module-checkout/view/frontend/web/template/billing-address/list.html or module-checkout/view/frontend/web/js/view/billing-address.js

  • Are you found any solution Commented Jun 15, 2017 at 11:22

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.