Search code examples
validationangulardevextreme

Angular 2 dev extreme dx-date-box validation of required field


I'm trying to use dx-date-box for date inputs but I can't make it validate required values on my form:

<dx-date-box placeholder="Request Date" required="true"
          formControlName="request_date" type="date" validationMessageMode="always" invalidDateMessage="{{VALIDATION.DATE_INVALID}}">
        </dx-date-box>

Invalid date validation is working and it shows the message, but it wont to validate required value and doesn't show required error. I'm not sure how to achieve that behaviour.


Solution

  • I found this code from DevExtreme Documentation

    Add dx-validator="dobValidationRules" to element and in angularJS, define dobValidationRules.

    $scope.dobValidationRules = {
            validationRules: [{
                type: "required",
                message: "Date of birth is required"
            }, {
                type: "range", 
                max: maxDate, 
                message: "You must be at least 21 years old"
            }]
        };
    

    Please find the actual working version here