4

is there any tutorial, documentation or hints how to add a custom form to the Payment&Review step for my custom offline payment module in Magento2 checkout process and how to connect it to the database? I have seen some tutorials that describe how to add fields to the shipping address (e.g. https://sohelrana09.wordpress.com/2015/11/28/how-to-add-custom-field-to-shipping-address-form-in-magento-2-onepage-checkout/) but that is no option for me because the solution should work even for products without shipping. Any ideas?

Thanks a lot

1
  • Have you got any answer? I also met the same issue.. Kindly share your solution?
    – DRAJI
    Aug 9, 2016 at 10:00

2 Answers 2

0

In this page of the docs you can find how to add a custom form.

That tutorial you linked can you also use to add fields to other parts of the shipping step btw. It doesn't have to be in the shipping address form.

0
<?php

       namespace Codilar\Field\Model\Plugin\Checkout;
        class LayoutProcessor2
{
    /**
     * @param \Magento\Checkout\Block\Checkout\LayoutProcessor $subject
     * @param array $jsLayout
     * @return array
     */
    public function afterProcess(
        \Magento\Checkout\Block\Checkout\LayoutProcessor $subject,
        array  $jsLayout
    ) {
        $configuration = $jsLayout['components']['checkout']['children']['steps']['children']['billing-step']['children']['payment']['children']['payments-list']['children'];
        foreach ($configuration as $paymentGroup => $groupConfig) {
            if (isset($groupConfig['component']) AND $groupConfig['component'] === 'Magento_Checkout/js/view/billing-address') {

                $jsLayout['components']['checkout']['children']['steps']['children']['billing-step']['children']
                ['payment']['children']['payments-list']['children'][$paymentGroup]['children']['form-fields']['children']['company_tax_id'] = [
                    'component' => 'Magento_Ui/js/form/element/abstract',
                    'config' => [
                        'customScope' => 'billingAddress.custom_attributes',
                        'template' => 'ui/form/field',
                        'elementTmpl' => 'ui/form/element/input',
                        'options' => [],
                        'id' => 'custom-field'
                    ],
                    'dataScope' => 'billingAddress.custom_attributes.custom_field',
                    'label' => 'Custom Field',
                    'provider' => 'checkoutProvider',
                    'visible' => true,
                    'validation' => [],
                    'sortOrder' => 250,
                    'id' => 'custom-field'
                ];
            }
        }
        return $jsLayout;
    }
}

<?php
namespace Codilar\Field\Model\Plugin\Checkout;

class LayoutProcessor
{
    /**
     * @param \Magento\Checkout\Block\Checkout\LayoutProcessor $subject
     * @param array $jsLayout
     * @return array
     */
    public function afterProcess(\Magento\Checkout\Block\Checkout\LayoutProcessor $subject, array  $jsLayout )
    {
        $jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']['children']
        ['shippingAddress']['children']['shipping-address-fieldset']['children']['custom_field'] = [
            'component' => 'Magento_Ui/js/form/element/abstract',
            'config' => [
                'customScope' => 'shippingAddress.custom_attributes',
                'template' => 'ui/form/field',
                'elementTmpl' => 'ui/form/element/input',
                'options' => [],
                'id' => 'custom-field'
            ],
            'dataScope' => 'shippingAddress.custom_attributes.custom_field',
            'label' => 'Custom Field',
            'provider' => 'checkoutProvider',
            'visible' => true,
            'validation' => [],
            'sortOrder' => 250,
            'id' => 'custom-field'
        ];
        return $jsLayout;
    }
}

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.