how to make Ui admin form field disable dynamically

Question

I have ui componenet form i want to disable one field dynamically when add only.

 <field formElement="select" name="classification" sortOrder="40">
        <settings>
            <dataType>text</dataType>
            <label translate="true">Classification</label>
            <disabled>true</disabled>
            <dataScope>classification</dataScope>
            <validation>
                <rule name="required-entry" xsi:type="boolean">true</rule>
            </validation>
        </settings>
        <formElements>
            <select>
                <settings>
                    <options class="Vendor\Module\Model\Object\Source\DivisionAgeFrontEndClass"/>
                </settings>
            </select>
        </formElements>
    </field>

<disabled>true</disabled> this line disable for all action. i have refer this link but not getting idea how to use this

Here is Dataprovider.php code

public function getData()
    {
        if (isset($this->loadedData)) {
            return $this->loadedData;
        }
        $items = $this->collection->getItems();
        foreach ($items as $model) {
            $this->loadedData[$model->getId()] = $model->getData();
        }
        $data = $this->dataPersistor->get('pacreg_team');

        if (!empty($data)) {
            $model = $this->collection->getNewEmptyItem();
            $model->setData($data);
            $this->loadedData[$model->getId()] = $model->getData();
            $this->dataPersistor->clear('pacreg_team');
        }

        return $this->loadedData;
    }

Answer 1

DataProvider.php

public function getData()
{
    if (isset($this->loadedData)) {
        return $this->loadedData;
    }
    $items = $this->collection->getItems();
    foreach ($items as $model) {
        $this->loadedData[$model->getId()] = $model->getData();
        if ($model->getId()) {
            $this->loadedData[$model->getId()]['do_we_hide_it'] = true;
        } else {
            $this->loadedData[$model->getId()]['do_we_hide_it'] = false;
        }
    }
    $data = $this->dataPersistor->get('pacreg_team');

    if (!empty($data)) {
        $model = $this->collection->getNewEmptyItem();
        $model->setData($data);
        $this->loadedData[$model->getId()] = $model->getData();
        $this->dataPersistor->clear('pacreg_team');
    }

    return $this->loadedData;
}

in your form ui component

<field formElement="select" name="classification" sortOrder="40">
        <settings>
            <dataType>text</dataType>
            <label translate="true">Classification</label>
            <dataScope>classification</dataScope>
            <imports>
                <link name="disabled">${ $.provider}:data.do_we_hide_it</link>
            </imports>
            <validation>
                <rule name="required-entry" xsi:type="boolean">true</rule>
            </validation>
        </settings>
        <formElements>
            <select>
                <settings>
                    <options class="Vendor\Module\Model\Object\Source\DivisionAgeFrontEndClass"/>
                </settings>
            </select>
        </formElements>
    </field>

Answer 2

You can use the below import syntax to dynamically disable the fields

<field formElement="select" name="classification" sortOrder="40">
    <settings>
        <dataType>text</dataType>
        <label translate="true">Classification</label>
        <disabled>true</disabled>
        <dataScope>classification</dataScope>
        <!-- start import check the condition -->
        <imports> 
            <link name="disabled">${ $.provider }:data.general.disable_classification</link>
        </imports>
        <!-- end import check the condition -->
        <validation>
            <rule name="required-entry" xsi:type="boolean">true</rule>
        </validation>
    </settings>
    <formElements>
        <select>
            <settings>
                <options class="Vendor\Module\Model\Object\Source\DivisionAgeFrontEndClass"/>
            </settings>
        </select>
    </formElements>
</field>

in your dataprovider class file in the getData() function you can add value off data.general.disable_classification so based on that field will be disabled.

you can refer this snippet before returning the data

$classification = $data['items'][0]['classification'];
$generalData = $data['items'][0];
$generalData['disable_classification'] = !empty($generalData['classification']);  // add your boolean condition to disable element
$newData[$classification] = [
    'general' => $generalData,
];
$return $newData;

let me know based on this is the way you dynamically want to disable it. If you want to disable it based on the other form element. I'll update the answer

Answer 3

You can override getMeta() function in your DataProvider class

public function getMeta()
{
$meta = parent::getMeta();
$id = $this->request->getParam('entity_id');
if(isset($id)){

$meta['fieldset_name']['children']['field_name']['arguments']['data']['config']['visible'] = 1;
}
else{
$meta['fieldset_name']['children']['field_name']['arguments']['data']['config']['visible'] = 0; 
}
return $meta;
}

Hope that's helpful!