Skip to content
Browse files

Display validation errors on login and register forms

  • Loading branch information...
1 parent e67553b commit b841b0fe792036567859fe0d7801116b15998ab0 @zachmullen zachmullen committed Mar 19, 2012
Showing with 55 additions and 2 deletions.
  1. +16 −0 public/css/extension/extension.view.css
  2. +35 −2 public/js/extension/extension.view.js
  3. +4 −0 views/extension/view.phtml
View
16 public/css/extension/extension.view.css
@@ -298,3 +298,19 @@ div.logoutDiv a:hover {
text-decoration: underline;
}
+div.loginError,div.registerError {
+ color: red;
+ font-weight: bold;
+}
+
+div.loginError {
+ padding-bottom: 8px;
+}
+
+input.invalidField {
+ background-color: #ff9191;
+}
+
+input.validField {
+ background-color: #91ff91;
+}
View
37 public/js/extension/extension.view.js
@@ -9,6 +9,7 @@ var json = null;
midas.slicerappstore.doLogin = function () {
var content = $('#loginFormTemplate').clone();
content.find('form.loginForm').attr('id', 'loginForm');
+ content.find('div.loginError').attr('id', 'loginError');
showDialogWithContent('Login', content.html(), false, { width: 320 });
$('a.registerLink').click(midas.slicerappstore.doRegister);
$('#loginForm').ajaxForm({
@@ -17,7 +18,7 @@ midas.slicerappstore.doLogin = function () {
if(resp.status == 'ok') {
window.location.reload();
} else {
- //TODO report login errors in a convenient way
+ $('#loginError').html('Login failed');
}
}
});
@@ -29,6 +30,7 @@ midas.slicerappstore.doLogin = function () {
midas.slicerappstore.doRegister = function () {
var content = $('#registerFormTemplate').clone();
content.find('form.registerForm').attr('id', 'registerForm');
+ content.find('div.registerError').attr('id', 'registerError');
showDialogWithContent('Register', content.html(), false, { width: 380 });
$('a.loginLink').click(midas.slicerappstore.doLogin);
$('#registerForm').ajaxForm({
@@ -37,7 +39,38 @@ midas.slicerappstore.doRegister = function () {
if(resp.status == 'ok') {
window.location.reload();
} else {
- //TODO report registration errors in a convenient way
+ var errorText = '<ul>';
+ if(resp.alreadyRegistered) {
+ $('#registerForm').find('input[type=text],input[type=password]')
+ .removeClass('invalidField').addClass('validField');
+ $('#registerForm').find('input[name=email]').removeClass('validField').addClass('invalidField');
+ errorText += '<li>'+resp.message+'</li>';
+ } else {
+ $('#registerForm').find('input[type=text],input[type=password]')
+ .removeClass('validField').addClass('invalidField');
+
+ $.each(resp.validValues, function(field, value) {
+ $('#registerForm').find('input[name='+field+']')
+ .removeClass('invalidField').addClass('validField');
+ });
+ if(!resp.validValues.email) {
+ errorText += '<li>Invalid email</li>';
+ }
+ if(!resp.validValues.firstname) {
+ errorText += '<li>Invalid first name</li>';
+ }
+ if(!resp.validValues.lastname) {
+ errorText += '<li>Invalid last name</li>';
+ }
+ if(!resp.validValues.password1) {
+ errorText += '<li>Invalid password</li>';
+ }
+ if(!resp.validValues.password2) {
+ errorText += '<li>Passwords must match</li>';
+ }
+ }
+ errorText += '</ul>';
+ $('#registerError').html(errorText);
}
}
});
View
4 views/extension/view.phtml
@@ -157,6 +157,8 @@ if($this->slicerView)
<!-- TEMPLATE: login form -->
<div id="loginFormTemplate" style="display:none;">
+ <div class="loginError">
+ </div>
<form class="loginForm dialogForm" method="POST" action="<?php echo $this->webroot?>/user/ajaxlogin">
<table>
<tr><td>E-mail</td><td><input name="email" type="text" /></td></tr>
@@ -171,6 +173,8 @@ if($this->slicerView)
<!-- TEMPLATE: register form -->
<div id="registerFormTemplate" style="display:none;">
+ <div class="registerError">
+ </div>
<form class="registerForm dialogForm" method="POST" action="<?php echo $this->webroot?>/user/ajaxregister">
<table>
<tr><td>E-mail</td><td><input name="email" type="text" /></td></tr>

0 comments on commit b841b0f

Please sign in to comment.
Something went wrong with that request. Please try again.