Currently, I am learning Angular and have created an input field with type 'text' to display a date in the format "99/99/9999" using ui.mask. I have also implemented validation in the module to prevent submission (unblocking button) if the entered date is incorrect, such as 00/00/0000 or 12/12/1700. However, even when the date is invalid, the input field does not show a red frame to indicate the error. How can I modify it to display a red frame based on the module's validation?
HTML
<input
id="dob"
type="text"
class="form-control cell-height form-input"
ng-model="createAccount.dob"
ui-mask="99/99/9999"
placeholder="D.O.B. (mm/dd/yyyy)"
required/>
CONTROLLER
var validateDob = function () {
try {
var date = moment.utc($scope.createAccount.dob, "MM/DD/YYYY");
if ($scope.patient == null) $scope.patient = {};
if (!date.utc().isValid()) return false;
if (date.utc().date() == 0 || date.utc().year() == 0) return false;
if (date.utc().isAfter(moment().utc())) return false;
if (date.utc().isSame(moment().utc())) return false;
if (!date.utc().isAfter(moment.utc().subtract(150, 'years'))) {
return false;
}
$scope.createAccount.dateOfBirth = date.utc();//.format("YYYY/MM/DD");
return true;
}
catch (err) {
return false;
}
};