2

I want to add custom dropdown in checkout page where dropdown contain following value:option1 and option2

4
  • In which section do you want dropdown like shipping address etc..? May 29 '19 at 9:54
  • on which step?\
    – Amit Bera
    May 29 '19 at 10:09
  • Shipping Address @ChiragPatel
    – Magento
    May 29 '19 at 10:32
  • Shipping Address @AmitBera
    – Magento
    May 29 '19 at 10:32
2

Overwrite Magento\Checkout\Block\Checkout\LayoutProcessor process method in your custom module. So create a plugin,

Namespace/CheckoutAdditionalField/Plugin/Checkout/Model/Checkout/LayoutProcessor.php

namespace Namespace\CheckoutAdditionalField\Plugin\Checkout\Model\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']['delivery_date'] = [
            'component' => 'Magento_Ui/js/form/element/abstract',
            'config' => [
                'customScope' => 'shippingAddress',
                'template' => 'ui/form/field',
                'elementTmpl' => 'ui/form/element/date',
                'options' => [],
                'id' => 'delivery-date'
            ],
            'dataScope' => 'shippingAddress.delivery_date',
            'label' => 'Delivery Date',
            'provider' => 'checkoutProvider',
            'visible' => true,
            'validation' => [],
            'sortOrder' => 250,
            'id' => 'delivery-date'
        ];

        $jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']['children']
        ['shippingAddress']['children']['shipping-address-fieldset']['children']['drop_down'] = [
            'component' => 'Magento_Ui/js/form/element/select',
            'config' => [
                'customScope' => 'shippingAddress',
                'template' => 'ui/form/field',
                'elementTmpl' => 'ui/form/element/select',
                'id' => 'drop-down',
            ],
            'dataScope' => 'shippingAddress.drop_down',
            'label' => 'Drop Down',
            'provider' => 'checkoutProvider',
            'visible' => true,
            'validation' => [],
            'sortOrder' => 251,
            'id' => 'drop-down',
            'options' => [
                [
                    'value' => '',
                    'label' => 'Please Select',
                ],
                [
                    'value' => '1',
                    'label' => 'First Option',
                ]
            ]
        ];

        return $jsLayout;
    }
}

I hope it helps!

7
  • How can value store in database? @Chirag Patel
    – Magento
    May 29 '19 at 10:56
  • Let me see and get back to you once i found something about save data to database. May 29 '19 at 10:58
  • Okay thank you @Chirag Patel
    – Magento
    May 29 '19 at 11:05
  • Create UpgradeSchema.php file in your custom module. and follow this to create a field in database magento.stackexchange.com/questions/126036/… May 29 '19 at 11:32
  • and How to add dropdown in Review & Payment Step? @Chirag Patel
    – Magento
    May 30 '19 at 6:42

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