[FIXED] How to add field in cms_page_from using php [Magento 2]

Issue

I am trying to add an input field per store on my CMS page form (the page where we create the CMS page), but the catch is that it needs to be dynamic, I want the input's to appear for each store instead of adding static fields.

Something like what @Dhiren Vasoya does here: https://magecomp.com/blog/magento-2-add-new-field-in-admin-user-create-form/

but to the cms page form.

Thank you for your time in advance!

Solution

Here is the solution!

Step 1: Firstly, add the below given code in your form file( in this case cms_page_form.xml in the app\code\Vendor\Extension\view\adminhtml\ui_component folder:

<fieldset name="dynamic_fieldset" class="Vendor\Extension\Ui\Component\Form\Fieldset">

    <argument name="data" xsi:type="array">

        <item name="config" xsi:type="array">

            <item name="label" xsi:type="string" translate="true">Dynamic Fields</item>

            <item name="sortOrder" xsi:type="number">1000</item>

        </item>

    </argument>

</fieldset>

Step 2: After the above step create Fieldset.php file in the app\code\Vendor\Extension\Ui\Component\Form folder and add the below given code:

 <?php
    namespace Vendor\Extension\Ui\Component\Form;
    use Magento\Framework\View\Element\UiComponent\ContextInterface;
    use Magento\Ui\Component\Form\FieldFactory;
    class Fieldset extends \Magento\Ui\Component\Form\Fieldset
    {
        protected $fieldFactory;
        public function __construct(
            ContextInterface $context,
            array $components = [],
            array $data = [],
            FieldFactory $fieldFactory)
        {
            parent::__construct($context, $components, $data);
            $this->fieldFactory = $fieldFactory;
        }
        public function getChildComponents()
        {
            $options = [
                0 => [
                    'label' => 'Option 1',
                    'value' => 1
                ],
                1  => [
                    'label' => 'Option 2',
                    'value' => 2
                ],
                2 => [
                    'label' => 'Option 3',
                    'value' => 3
                ],
            ];
            $fields = [
                [
                    'label' => __('Label'),
                    'value' => __('Label Value'),
                    'formElement' => 'input',
                ],
                [
                    'label' => __('Checkbox'),
                    'value' => __('0'),
                    'formElement' => 'checkbox',
                ],
                [
                    'label' => __('Dropdown'),
                    'options' => $options,
                    'formElement' => 'select',
                ],
            ];
            foreach ($fields as $key => $field) {
                $fieldInstance = $this->fieldFactory->create();
                $name = 'custom_field_' . $key;
                $fieldInstance->setData(
                    [
                        'config' => $field,
                        'name' => $name
                    ]
                );
                $fieldInstance->prepare();
                $this->addComponent($name, $fieldInstance);
            }
            return parent::getChildComponents();
        }
    }

Step 3: Lastly, after following the above steps clear cache.

cc: https://magecomp.com/blog/dynamically-add-fields-in-custom-admin-form-using-ui-component/

Answered By - Setura Pedro

Answer Checked By - Mildred Charles (PHPFixing Admin)