devdocs icon indicating copy to clipboard operation
devdocs copied to clipboard

Published 20 hours ago • verified publisher icon magento

Edit checkout form code sample causes errors.

Open ioweb-gr opened this issue 3 years ago • 1 comments

General issue

The article applies correctly to the shipping address fields for example but it won't work for billing address fields.

Description:

(https://devdocs.magento.com/guides/v2.4/howdoi/checkout/checkout_edit_form.html)

When trying to override the elementTmpl of a billing address field like company for example using the above guide as an example, you will receive a knockout.js error

Possible solutions:

It would be great if an example about billing address fields modifications like the company field could be provided

Additional information:

As a test you can copy the original input element template and add it to your module then try to override the company field like this. If you do the same for shipping address it works but for billing address it throws an error


<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <script src="Vendor_Module::js/invoice-dependencies.js"/>
    </head>

    <body>
        <referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">

                                        <item name="billing-step" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="payment" xsi:type="array">
                                                    <item name="children" xsi:type="array">

                                                        <item name="payments-list" xsi:type="array">
                                                            <item name="children" xsi:type="array">
                                                                <item name="banktransfer-form" xsi:type="array">
                                                                    <item name="children" xsi:type="array">
                                                                        <item name="form-fields" xsi:type="array">
                                                                            <item name="children" xsi:type="array">
                                                                                <item name="company" xsi:type="array">
                                                                                    <item name="config" xsi:type="array">
                                                                                        <item name="elementTmpl" xsi:type="string">Vendor_Module/form/element/input</item>
                                                                                    </item>
                                                                                    <item name="validation" xsi:type="array">
                                                                                        <item name="required-entry" xsi:type="boolean">true</item>
                                                                                    </item>
                                                                                </item>
                                                                            </item>
                                                                        </item>
                                                                    </item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                        <item name="afterMethods" xsi:type="array">
                                                            <item name="children" xsi:type="array">
                                                                <item name="billing-address-form" xsi:type="array">
                                                                    <item name="children" xsi:type="array">
                                                                        <item name="form-fields" xsi:type="array">
                                                                            <item name="children" xsi:type="array">                                                                             
                                                                                <item name="company" xsi:type="array">
                                                                                    <item name="config" xsi:type="array">
                                                                                        <item name="elementTmpl" xsi:type="string">Vendor_Module/form/element/input</item>
                                                                                    </item>
                                                                                    <item name="validation" xsi:type="array">
                                                                                        <item name="required-entry" xsi:type="boolean">true</item>
                                                                                    </item>
                                                                                </item>
                                                                            </item>
                                                                        </item>
                                                                    </item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>

                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>


Uncaught Error: Unable to process binding "ifnot: function(){return element.hasAddons() }"
Message: Unable to process binding "template: function(){return element.elementTmpl }"
Message: Anonymous template defined, but no template content was provided

ioweb-gr avatar Dec 12 '21 21:12 ioweb-gr

Hi @ioweb-gr. Thank you for your report. To speed up processing of this issue, make sure that you provided sufficient information.

Add a comment to assign the issue: @magento I am working on this

m2-assistant[bot] avatar Dec 12 '21 21:12 m2-assistant[bot]