0

For the checkout, I would like to use a different UI template to that which is used on the cart. Currently, they both use the same UI template: <item name="template" xsi:type="string">ui/form/field</item>

checkout_cart_index.xml

...
<block class="Magento\Checkout\Block\Cart\Shipping" name="checkout.cart.shipping" as="shipping" template="cart/shipping.phtml" after="checkout.cart.summary.title">
    <arguments>
        <argument name="jsLayout" xsi:type="array">
            <item name="types" xsi:type="array">
                <item name="form.input" xsi:type="array">
                    <item name="component" xsi:type="string">Magento_Ui/js/form/element/abstract</item>
                    <item name="config" xsi:type="array">
                        <item name="provider" xsi:type="string">checkoutProvider</item>
                        <item name="deps" xsi:type="array">
                            <item name="0" xsi:type="string">checkoutProvider</item>
                        </item>
                        <item name="template" xsi:type="string">ui/form/field</item>
                        <item name="elementTmpl" xsi:type="string">ui/form/element/input</item>
                    </item>
                </item>
            </item>
            <item name="components" xsi:type="array">
                <item name="summary-block-config" xsi:type="array">
                    <item name="component" xsi:type="string">uiComponent</item>
                    <item name="children" xsi:type="array">
                        <item name="shipping-rates-validation" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <!--Step configuration components-->
                            </item>
                        </item>
                    </item>
                </item>
                ...

checkout_index_index.xml

...
<block class="Magento\Checkout\Block\Onepage" name="checkout.root" template="onepage.phtml" cacheable="false">
    <arguments>
        <argument name="jsLayout" xsi:type="array">
            <item name="types" xsi:type="array">
                <item name="form.input" xsi:type="array">
                    <item name="component" xsi:type="string">Magento_Ui/js/form/element/abstract</item>
                    <item name="config" xsi:type="array">
                        <item name="provider" xsi:type="string">checkoutProvider</item>
                        <item name="deps" xsi:type="array">
                            <item name="0" xsi:type="string">checkoutProvider</item>
                        </item>
                        <item name="template" xsi:type="string">ui/form/field</item>
                        <item name="elementTmpl" xsi:type="string">ui/form/element/input</item>
                    </item>
                </item>
            </item>
            ...

As you can see, both are using the template <item name="template" xsi:type="string">ui/form/field</item>. I would like to change this template on the checkout to be something like: <item name="template" xsi:type="string">ui/form/field-checkout-only</item>, as I would like to add some more attributes to the fields when on checkout.

I've tried to do this by creating app/design/frontend/mitch/my_theme/Magento_Ui/web/templates/form/field-checkout-only.html – this didn't work.

I then tried to change the <item name="template" xsi:type="string">ui/form/field</item> to <item name="template" xsi:type="string">Magento_Ui::ui/form/field</item>, but this still doesn't work.

Any ideas?

0

For custom theme remove web folder

Change

app/design/frontend/mitch/my_theme/Magento_Ui/web/templates/form/field-checkout-only.html 

To

app/design/frontend/mitch/my_theme/Magento_Ui/templates/form/field-checkout-only.html 
  • Unfortunately, that didn't work. Any other ideas? Thanks for your input. – Mitch7663 Nov 9 '16 at 13:46
  • @Mitch7663 did you check with default file it is working or not? – Fme Extensions Nov 10 '16 at 5:30
  • I worked out Magento have also specified the template in the Magento\Checkout\Block\Checkout\AttributeMerger class... ` 'config' => [ 'customScope' => $dataScopePrefix, 'template' => 'ui/form/field', 'elementTmpl' => 'ui/form/element/input' ],` Which isn't helpful :-( – Mitch7663 Nov 10 '16 at 9:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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