Skip to content

How to set a date field in a ui form to be mandatory?

I have this date field in a form (a ui component) and i’m tryig to make it “required field”, I tried with <item name="required-entry" xsi:type="boolean">true</item> but it didn’t work. And also tried with a custom validation but also not working, any ideas?

Date field in the form

        <field name="date_of_birth" formElement="date">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="source" xsi:type="string">Date of birth</item>
                </item>     
                <item name="validation" xsi:type="array">
                    <!-- <item name="required-entry" xsi:type="boolean">true</item>
                    <item name="validate-date" xsi:type="boolean">true</item> -->
                    <item name="date-required-custom" xsi:type="boolean">true</item>
                </item>    
            </argument>
            <settings>
                <dataType>timestamp</dataType>
                <label translate="true">Date of birth</label>
                <visible>true</visible>
                <dataScope>date_of_birth</dataScope>
            </settings>
        </field> 

Custom validation (I currently have more rules and they work)

require([
    'Magento_Ui/js/lib/validation/validator',
    'jquery'
], function (validator, $) {
    validator.addRule(
        'date-required-custom',
        function (value) {
            if (!(value == null || value === 'undefined')) {
                return false;
            };
        }
        ,$.mage.__('Field required.')
    );
});