Reading list Switch to dark mode

    Magento 2:- How to Create Radio button in Admin System Configuration

    Hello guys!!

    In this article, we will learn how to create a radio button in admin Configuration.
    Magento does provide the type to create a radio type field but if you use it, it will only show a single radio button without any title or value to save, So it requires a little custom task to make it look understandable and working.

    Let’s do it!!

    First, we will create a system.xml

    app/code/Webkul/Demo/etc/system.xml

    <?xml version="1.0"?>
    
    <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">
        <system>
            <tab id="webkul" translate="label" sortOrder="100">
                <label>Webkul</label>
            </tab>
            <section id="demo" translate="label" type="text" sortOrder="100" showInDefault="1" showInWebsite="1" showInStore="1">
                <label>Demo</label>
                <tab>webkul</tab>
                <resource>Webkul_Demo::config_demo</resource>
                <group id="general" translate="label" type="text" sortOrder="100" showInDefault="1" showInWebsite="1" showInStore="1">
                    <label>General Setting</label>
                    <field id="enable" translate="label" type="radios" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1" canRestore="1">
                        <label>Module</label>
                        <source_model>Webkul\Demo\Model\Config\Source\Radio</source_model>
                    </field>
                </group>
            </section>
        </system>
    </config>

    Note:- Field type is radios, not radio

    Start your headless eCommerce
    now.
    Read More

    Let’s create our custom source model.

    app/code/Webkul/Demo/Model/Config/Source/Radio

    <?php
    
    namespace Webkul\Demo\Model\Config\Source;
    
    class Radio implements \Magento\Framework\Data\OptionSourceInterface
    {
    
        /**
         * To option array
         */
        public function toOptionArray()
        {
            return [
                ['value' => 1, 'label' => __('Enable')],
                ['value' => 0, 'label' => __('Disable')]
            ];
        }
    }

    That’s all for this article. Let me know if this was helpful. Thank you for your time.

    . . .
    Add a comment

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top
    We endeavoured to re-platform our existing site and Webkul has been playing an integral part as far as transforming our basic Magneto instance into an online marketplace.
    Alex Maranduik
    Director, Marketing
    www.labx.com
    Talk to Sales

    Global

    Live Chat

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home