0

I want to add a drop-down here enter image description here

I can add area text field but when it comes to drop-down, I am facing problem.

2
Step 1: Create module.xml

app/code/SR/CheckoutAdditionalField/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="SR_CheckoutAdditionalField" setup_version="2.0.0">
        <sequence>
            <module name="Magento_Checkout"/>
        </sequence>
    </module>
</config>

Step 2: Create composer.json
app/code/SR/CheckoutAdditionalField/composer.json

{
    "name": "sr/module-checkoutadditionalfield",
    "description": "Checkout Additional Field",
    "require": {
        "php": "~5.5.0|~5.6.0|~7.0.0",
        "magento/framework": "100.0.*",
        "magento/module-ui": "100.0.*",
        "magento/module-config": "100.0.*",
        "magento/module-checkout": "100.0.*"
    },
    "type": "magento2-module",
    "version": "100.0.0",
    "license": [
        "OSL-3.0",
        "AFL-3.0"
    ],
    "autoload": {
        "files": [ "registration.php" ],
        "psr-4": {
            "SR\\CheckoutAdditionalField\\": ""
        }
    }
}

Step 3: Create registration.php
app/code/SR/CheckoutAdditionalField/registration.php

\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE,
    'SR_CheckoutAdditionalField',
    __DIR__
);

Step 4: Now need to overwrite Magento\Checkout\Block\Checkout\LayoutProcessor process method. So create a plugin,
SR/CheckoutAdditionalField/Plugin/Checkout/Model/Checkout/LayoutProcessor.php

namespace SR\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;
    }
}
  • yes i tried that it just add field in the Fronted buti want to have the info in database – Developper Magento Jan 13 at 6:14
  • 1
    you can create manually after run below command php bin/magento setup:di:compile – Rakesh Donga Jan 16 at 5:42
  • so you mean just with this code i will have the two attributes frop down and delivery date in base ???? – Developper Magento Jan 16 at 8:09
  • you can use below link for ref: here setup file also available Please check and accept the answer if it's helpful. [github.com/sohelrana09/magento2-module-delivery-date] – Rakesh Donga Jan 16 at 8:30
  • 1
    you can modify above extension and unnecessary files remove this extension is very useful and needful Please check and accept the answer if it's helpful. – Rakesh Donga Jan 16 at 8:55

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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