0
私はangularjsログインとパスワードを忘れたモジュールに取り組んでいます。ユーザーがクリックするとその皮のログインフォームやショーは、ユーザーが彼/彼女のEMAILIDを入力して、フォームを送信した後、パスワードフォームを忘れてしまったパスワードを忘れた場合はAngularJSを使用してメッセージを送信した後にフォームデータをクリアする方法は？
私のコードは
<body data-ng-cloak data-ng-app="LoginModule" data-ng-controller="LoginController">
<div id="login-page">
<div class="container" data-ng-show="ShowLoginBox">
<form class="form-login" id="LoginForm" autocomplete="off" enctype="multipart/form-data" name="LoginForm" novalidate="" data-ng-submit="LoginData(SALogin)">
<h2 class="form-login-heading">Login in now</h2>
<div class="login-wrap">
<div class="alert alert-danger alert-dismissable" data-ng-show="showWarningAlert">
<button type="button" class="close" data-ng-click="switchBool('showWarningAlert')">×</button><strong>{{WarningAlert}}</strong>
</div>
<div class="alert alert-success alert-dismissable" data-ng-show="showSuccessAlert">
<button type="button" class="close" data-ng-click="switchBool('showSuccessAlert')">×</button><strong>{{SuccessAlert}}</strong>
</div>
<input type="email" class="form-control" placeholder="Email-Id" id="email" name="email" data-ng-model="SALogin.email" pattern="^[a-zA-Z0-9-\_.][email protected][a-zA-Z0-9-\_.]+\.[a-zA-Z0-9.]{2,5}$" required autofocus />
<div class="error" data-ng-show="LoginForm.email.$dirty && LoginForm.email.$invalid">
<small class="error" data-ng-show="LoginForm.email.$error.required">Email-Id is required.</small>
<small class="error" data-ng-show="LoginForm.email.$error.email">Invalid Email-Id.</small>
</div>
<br>
<input type="password" class="form-control" placeholder="Password" maxlength="20" name="password" id="password" data-ng-model="SALogin.password" data-ng-minlength="8" data-ng-maxlength="20" required />
<div class="error" data-ng-show="LoginForm.password.$dirty && LoginForm.password.$invalid">
<small class="error" data-ng-show="LoginForm.password.$error.required">Password is required.</small>
<small class="error" data-ng-show="LoginForm.password.$error.minlength">Password is required to be at least 8 characters</small>
<small class="error" data-ng-show="LoginForm.password.$error.maxlength">Password cannot be longer than 20 characters</small>
</div>
<label class="checkbox"><span class="pull-right"><a href="#" data-ng-click="ForgotPwdBox()"> Forgot Password?</a></span></label>
<button class="btn btn-theme btn-block" type="submit" data-ng-disabled="LoginForm.$invalid" ><i class="fa fa-lock"></i> LOGIN</button>
<hr>
</div>
</form>
</div>
<div class="container" data-ng-show="ShowForgotPwdBox">
<form class="form-login" id="ForgotPwdForm" autocomplete="off" enctype="multipart/form-data" name="ForgotPwdForm" novalidate="" data-ng-submit="ForgotPwdData(SAForgotPwd)">
<h2 class="form-login-heading">Get New Password</h2>
<div class="login-wrap">
<div class="alert alert-danger alert-dismissable" data-ng-show="showWarningAlert">
<button type="button" class="close" data-ng-click="switchBool('showWarningAlert')">×</button><strong>{{WarningAlert}}</strong>
</div>
<div class="alert alert-success alert-dismissable" data-ng-show="showSuccessAlert">
<button type="button" class="close" data-ng-click="switchBool('showSuccessAlert')">×</button><strong>{{SuccessAlert}}</strong>
</div>
<input type="email" class="form-control" placeholder="Email-Id" id="email" name="email" data-ng-model="SAForgotPwd.email" pattern="^[a-zA-Z0-9-\_.][email protected][a-zA-Z0-9-\_.]+\.[a-zA-Z0-9.]{2,5}$" required autofocus />
<div class="error" data-ng-show="ForgotPwdForm.email.$dirty && ForgotPwdForm.email.$invalid">
<small class="error" data-ng-show="ForgotPwdForm.email.$error.required">Email-Id is required.</small>
<small class="error" data-ng-show="ForgotPwdForm.email.$error.email">Invalid Email-Id.</small>
</div>
<label class="checkbox"><span class="pull-right"><a href="#" data-ng-click="LoginBox()"> Back to Login?</a></span></label>
<button class="btn btn-theme btn-block" type="submit" data-ng-disabled="ForgotPwdForm.$invalid" ><i class="fa fa-lock"></i> Get New Password</button>
<hr>
</div>
</form>
</div>
</div>
</body>
です。ユーザーの投稿フォームの後、私はメッセージボックスと成功メッセージを表示しています。私は、フォームデータをクリアすることができないよ言い訳はその後
私のJSコードはここ
var Login = angular.module("LoginModule", [])
Login.controller("LoginController", function ($scope, $http, jsonFilter)
{
$scope.ShowLoginBox = true;
$scope.ShowForgotPwdBox = false;
$scope.showWarningAlert = false;
$scope.showSuccessAlert = false;
var logResult = function (data, status, headers, config)
{
return data;
};
$scope.LoginData = function (SALogin)
{
var config = { params: { SALogin: SALogin } };
$http.post("login-process.php", null, config)
.success(function (data, status, headers, config)
{
$scope.getCallJSONResult = logResult(data, status, headers, config);
if(data=="Success")
{
window.location.href = "dashboard.php";
$scope.SuccessAlert = data;
$scope.showSuccessAlert = true;
$scope.showWarningAlert = false;
}
if(data!="Success")
{
$scope.WarningAlert = data;
$scope.showWarningAlert = true;
}
//switch flag
$scope.switchBool = function (value) {
$scope[value] = !$scope[value];
};
})
.error(function (data, status, headers, config)
{
$scope.getCallJSONResult = logResult(data, status, headers, config);
});
};
$scope.ForgotPwdBox = function() {
$scope.ShowForgotPwdBox = true;
$scope.ShowLoginBox = false;
$scope.ForgotPwdData = function (SAForgotPwd)
{
var config = { params: { SAForgotPwd: SAForgotPwd } };
$http.post("forgot-password-process.php", null, config)
.success(function (data, status, headers, config)
{
$scope.getCallJSONResult = logResult(data, status, headers, config);
if(data=="Success")
{
$scope.SuccessAlert = "Check your mail for new password";
$scope.showSuccessAlert = true;
$scope.showWarningAlert = false;
}
if(data!="Success")
{
$scope.WarningAlert = data;
$scope.showWarningAlert = true;
}
//switch flag
$scope.switchBool = function (value) {
$scope[value] = !$scope[value];
};
})
.error(function (data, status, headers, config)
{
$scope.getCallJSONResult = logResult(data, status, headers, config);
});
};
};
$scope.LoginBox = function() {
$scope.ShowLoginBox = true;
$scope.ShowForgotPwdBox = false;
};
});
で成功/失敗メッセージを表示し、私はメッセージボックスを乱すことなく、データを消去する方法のアイデアを持っていません。 @Saurabhは、あなたがそれを削除するには、空の
$scope.SALogin = {};
として表示されますので、モデルをクリアする必要が言ったように
とメッセージボックスを表示した後、成功メッセージ
どのデータを消去しようとしていますか？ログインフォーム？ psswdフォームを忘れましたか？ – ocespedes
無効な詳細フォームを入力した場合は、フォームを消去してメッセージが表示されます。 – user1624540