Added better error messaging

This commit is contained in:
piratefinn 2017-09-15 17:33:34 +01:00
parent f34c558d41
commit 7f3e9f4fd0
5 changed files with 65 additions and 26 deletions

View file

@ -4,6 +4,7 @@
* Fixed register box view on login page
* Made the form reset properly if adding a new one
* Added better error messages on register and account edit
# v0.0.1

View file

@ -6,7 +6,7 @@
<div class="card-block p-4">
<h1>Register</h1>
<p class="text-muted">Create your account</p>
<!-- <div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-people"></i></span>
<select required class="form-control" type="text" formControlName="usertype">
@ -25,7 +25,7 @@
<span class="input-group-addon">@</span>
<input type="text" class="form-control" formControlName="email" placeholder="Email">
</div>
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-lock"></i></span>
<input type="password" class="form-control" formControlName="password" placeholder="Password">
@ -35,7 +35,7 @@
<span class="input-group-addon"><i class="icon-lock"></i></span>
<input type="password" class="form-control" formControlName="confirmpassword" placeholder="Repeat password">
</div>
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-people"></i></span>
<select required class="form-control" type="text" formControlName="usertype">
@ -45,7 +45,7 @@
</select>
</div>
</form>
<div [ngSwitch]="signupForm.getForm().value.usertype">
<div *ngSwitchCase="'customer'" >
<form [formGroup]="customerForm.getForm()" (ngSubmit)="onSubmitCustomer()">
@ -53,17 +53,17 @@
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="display_name" placeholder="Display Name">
</div>
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="full_name" placeholder="Full Name">
</div>
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="postcode" placeholder="Postcode">
</div>
<div class="input-group mb-3">
<span class="input-group-addon">Year of Birth</span>
<select class="form-control" type="text" formControlName="year_of_birth">
@ -80,9 +80,9 @@
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="name" placeholder="Organisation Name">
</div>
<!-- Uses the UK SIC 2007 classifications for sector as used by ONS -->
<div class="input-group mb-3">
<select required class="form-control" type="text" formControlName="sector">
<option value=''>Select Organisation Sector</option>
@ -108,17 +108,17 @@
<option value='T'>Household Domestic Business</option>
</select>
</div>
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="street_name" placeholder="Street Name">
</div>
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="town" placeholder="Town">
</div>
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="postcode" placeholder="Postcode">
@ -137,7 +137,7 @@
Form validation failed, please ensure the form is filled correctly.
</div>
<div *ngSwitchCase="'send_failed'" class="alert alert-danger" role="alert">
Failed to send to server, please try again later.
{{registerStatusError}}
</div>
</div>
</div>

View file

@ -16,7 +16,8 @@ export class RegisterComponent {
organisationForm: ValidationManager;
years: Object[];
registerStatus: any;
registerStatusError: string = 'Error received, please try again.';
constructor(
private http: Http,
private formBuilder: FormBuilder,
@ -51,9 +52,9 @@ export class RegisterComponent {
postcode: 'required',
});
}
onSubmitCustomer() {
console.log(this.signupForm.isValid());
if (!this.signupForm.isValid() && !this.customerForm.isValid()) {
console.log("Not Valid!");
@ -63,7 +64,7 @@ export class RegisterComponent {
}
let signupForm = this.signupForm.getForm().value;
let customerForm = this.customerForm.getForm().value;
let data = {
token: signupForm.token,
usertype: signupForm.usertype,
@ -85,14 +86,23 @@ export class RegisterComponent {
this.router.navigate(['/dashboard']);
},
error => {
console.log( error._body );
console.log('Register Error');
console.log(error);
try {
console.log(error.error);
let jsonError = error.json();
console.log("boop");
this.registerStatusError = '"' + jsonError.error + '" Error, ' + jsonError.message;
} catch(e) {
this.registerStatusError = 'There was a server error, please try again later.';
}
this.registerStatus = "send_failed";
console.log(this.registerStatus)
console.log(this.registerStatus);
}
);
}
onSubmitOrganisation() {
console.log(this.signupForm.isValid());
if (!this.signupForm.isValid() || !this.organisationForm.isValid()) {
console.log("Not Valid!");
@ -102,7 +112,7 @@ export class RegisterComponent {
}
let signupForm = this.signupForm.getForm().value;
let organisationForm = this.organisationForm.getForm().value;
let data = {
token: signupForm.token,
usertype: signupForm.usertype,
@ -125,7 +135,16 @@ export class RegisterComponent {
this.router.navigate(['/dashboard']);
},
error => {
console.log( error._body );
console.log('Register Error');
console.log(error);
try {
console.log(error.error);
let jsonError = error.json();
console.log("boop");
this.registerStatusError = '"' + jsonError.error + '" Error, ' + jsonError.message;
} catch(e) {
this.registerStatusError = 'There was a server error, please try again later.';
}
this.registerStatus = "send_failed";
console.log(this.registerStatus);
}

View file

@ -122,7 +122,7 @@
Form validation failed, please ensure the form is filled correctly.
</div>
<div *ngSwitchCase="'send_failed'" class="alert alert-danger" role="alert">
Failed to send to server, please try again later.
{{submitStatusError}}
</div>
</div>
</div>
@ -160,7 +160,7 @@
Form validation failed, please ensure the form is filled correctly.
</div>
<div *ngSwitchCase="'send_failed'" class="alert alert-danger" role="alert">
Failed to send to server, please try again later.
{{submitStatusError}}
</div>
</div>
</div>

View file

@ -14,6 +14,7 @@ export class AccountEditComponent implements OnInit {
accountType: any;
// @ViewChild('fileInput') fileInput;
submitStatus: any;
submitStatusError: string = 'Error received, please try again.';
constructor(
private http: Http,
@ -111,7 +112,16 @@ export class AccountEditComponent implements OnInit {
console.log(this.submitStatus);
},
error => {
console.log( error._body );
console.log('Edit Error');
console.log(error);
try {
console.log(error.error);
let jsonError = error.json();
console.log("boop");
this.submitStatusError = '"' + jsonError.error + '" Error, ' + jsonError.message;
} catch(e) {
this.submitStatusError = 'There was a server error, please try again later.';
}
this.submitStatus = "send_failed";
console.log(this.submitStatus);
}
@ -159,7 +169,16 @@ export class AccountEditComponent implements OnInit {
console.log(this.submitStatus);
},
error => {
console.log( error._body );
console.log('Edit Error');
console.log(error);
try {
console.log(error.error);
let jsonError = error.json();
console.log("boop");
this.submitStatusError = '"' + jsonError.error + '" Error, ' + jsonError.message;
} catch(e) {
this.submitStatusError = 'There was a server error, please try again later.';
}
this.submitStatus = "send_failed";
console.log(this.submitStatus);
}