I have a user login and registration form. The default values that are currently showing I think are what my browser has cached. I am trying to figure out how to get rid of it programmatically so my input boxes are empty. When I refresh the page I get the image below. I have tried setting the $scope values for the boxes to empty strings, but this does not work when the page is refreshed.
What should I do so the input boxes are blank.
Here is my HTML code
<div class="root" ng-controller="userController">
<div class=user>
<form name="login_form" >
<h2 class>Login</h2>
<h3 class = "login_page">UserName</h3>
<input ng-model="user" type="text" ng-minlength="1" required>
<h3 class = "login_page">Password</h3>
<input ng-model="password" type="password" name="password" ng-minlength="4" required>
<input type="submit" value="Login" ng-click="login()" >
<div ng-if ="login_form.$submitted" ng-messages="login_form.password.$error" style="color:maroon" role="alert">
<div ng-message="minlength">Your field is too short</div>
</div>
<p ng-if="error">Username or login is incorrect</p>
</form>
</div>
<div class=user>
<form name = "register_form">
<h2 class>Register</h2>
<h3 class = "login_page">UserName</h3>
<input ng-model="reg.name" type="text" required>
<h3 class = "login_page">Password</h3>
<input ng-model="reg.password" type="password">
<input type="submit" value="Register" ng-click="register()" required >
<p ng-if="small">Password must be at least 5 chars long</p>
<p ng-if="duplicate">That user name is taken, please choose another</p>
<p ng-if="correct">Registration Succesfull</p>
</form>
</div>
</div>
Here is my js controller code
app.controller('userController', ['$scope', '$location', 'userFactory', function($scope, $location, userFactory){
index = function(){
userFactory.set_name(function(returned_data){
$scope.reg = {name:''};
erase();
})
}
index();
$scope.login = function(){
userFactory.login($scope.user, $scope.password, function(sendUser){
if(!sendUser.data.error){
$location.url('/logged_in');
}else {
$scope.error = true;
erase();
}
})
}
$scope.register = function(){
$scope.small = false;
if($scope.reg.password.length < 5){
$scope.small = true;
}else {
userFactory.register($scope.reg.name, $scope.reg.password, function(sendUser){
console.log(sendUser)
$scope.duplicate = false;
$scope.correct = false;
if(sendUser.data.error){
$scope.duplicate = true;
erase();
}else {
$scope.correct = true;
erase();
}
})
}
}
erase = function(){
$scope.reg.name = "";
$scope.reg.password = "";
$scope.user = "";
$scope.password = "";
}
}]);
I have also tried ng-init="user=''" in my input tag for user. That also did not work