I implemented a login form on my website. After submitting the form, I clear it and set it to Pristine mode. However, the error message still persists.
Below is the code for my form:
<form name="loginForm" ng-submit="loginForm.$valid && login(user)" novalidate style="position: relative">
<div class="log-input-frm mdl-textfield mdl-js-textfield mdl-textfield--floating-label textfield-demo">
<div class="col-sm-12 f_name">
<input ng-model="user.username" name="username" type="email" placeholder="Email address" required="">
<div ng-show="loginForm.$submitted || loginForm.username.$touched" ng-model="loginForm.username">
<span ng-show="loginForm.username.$error.required" class="text-danger">Please enter email address.</span>
<span ng-show="loginForm.username.$error.email" class="text-danger">Please enter valid email address.</span>
</div>
</div>
</div>
<div class="log-input-frm mdl-textfield mdl-js-textfield mdl-textfield--floating-label textfield-demo">
<div class="col-sm-12 f_name">
<input ng-model="user.password" name="password" type="password" placeholder="Password" required="">
<div ng-show="loginForm.$submitted || loginForm.password.$touched" ng-model="loginForm.password">
<span ng-show="loginForm.password.$error.required" class="text-danger">Please enter password.</span>
</div>
</div>
</div>
<div class="buttons">
<span class="signup pull-left">
<a ui-sref="forgotpassword">Forgot password</a>
</span>
<div class="link">
<div class="link" style="padding-bottom:0;">
<md-button type="submit" class="md-raised primary" > Login </md-button>
</div>
</div>
</div>
</form>
I also have controller code to reset the form and set it back to pristine mode:
$scope.loginForm.$setPristine();
$scope.loginForm.$setUntouched();
$scope.user = {};
Despite this, the error message still remains visible. Can you help me figure out what went wrong?