Proper Working Validation added

Still needs visual validation
This commit is contained in:
piratefinn 2017-06-05 15:22:51 +01:00
parent 9dc82fb4fe
commit d8ff4064e2
2 changed files with 75 additions and 20 deletions

View file

@ -15,7 +15,7 @@
<option value='customer'>Customer</option>
</select>
</div> -->
<form [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
<form [formGroup]="signupForm.getForm()">
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-key"></i></span>
<input type="text" class="form-control" formControlName="token" placeholder="Token">
@ -46,9 +46,9 @@
</div>
</form>
<div [ngSwitch]="signup.getForm().value.usertype">
<div [ngSwitch]="signupForm.getForm().value.usertype">
<div *ngSwitchCase="'customer'" >
<form [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
<form [formGroup]="customerForm.getForm()" (ngSubmit)="onSubmitCustomer()">
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" formControlName="display_name" placeholder="Display Name">
@ -75,15 +75,15 @@
</form>
</div>
<div *ngSwitchCase="'organisation'">
<form [formGroup]="signup.getForm()" (ngSubmit)="onSubmit()">
<form [formGroup]="organisationForm.getForm()" (ngSubmit)="onSubmitOrganisation()">
<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">
<input type="text" class="form-control" formControlName="name" placeholder="Organisation 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="name" placeholder="Organisation Name">
<input type="text" class="form-control" formControlName="street_name" placeholder="Street Name">
</div>
<div class="input-group mb-3">

View file

@ -12,7 +12,9 @@ import 'rxjs/add/operator/map';
})
export class RegisterComponent {
signup: ValidationManager;
signupForm: ValidationManager;
customerForm: ValidationManager;
organisationForm: ValidationManager;
ageRanges: Object[];
constructor(
@ -28,30 +30,83 @@ export class RegisterComponent {
this.ageRanges = result.ages;
}
);
this.signup = new ValidationManager({
this.signupForm = new ValidationManager({
token: 'required',
usertype: 'required',
name: 'required',
full_name: 'required',
display_name: 'required',
email: 'required',
postcode: 'required',
street_name: 'required',
town: 'required',
age_range: 'required',
password: 'required',
confirmpassword: 'required|equalTo:password'
});
this.customerForm = new ValidationManager({
display_name: 'required',
full_name: 'required',
postcode: 'required',
age_range: 'required',
});
this.organisationForm = new ValidationManager({
name: 'required',
street_name: 'required',
town: 'required',
postcode: 'required',
});
}
onSubmit() {
onSubmitCustomer() {
console.log(this.signup.isValid());
console.log(this.signup.getForm().value);
console.log(this.signupForm.isValid());
if (!this.signupForm.isValid() && !this.customerForm.isValid()) {
console.log("Not Valid!");
return;
}
let signupForm = this.signupForm.getForm().value;
let customerForm = this.customerForm.getForm().value;
let data = {
token: signupForm.token,
usertype: signupForm.usertype,
email: signupForm.email,
password: signupForm.password,
display_name: customerForm.display_name,
full_name: customerForm.full_name,
postcode: customerForm.postcode,
age_range: customerForm.age_range,
};
console.log(data);
/* this.api
.register(this.signup.value)
.register(data)
.subscribe(
result => {
console.log('registered!');
this.router.navigate(['/dashboard']);
},
error => {
console.log( error._body );
}
);*/
}
onSubmitOrganisation() {
console.log(this.signupForm.isValid());
if (!this.signupForm.isValid() || !this.organisationForm.isValid()) {
console.log("Not Valid!");
return;
}
let signupForm = this.signupForm.getForm().value;
let organisationForm = this.organisationForm.getForm().value;
let data = {
token: signupForm.token,
usertype: signupForm.usertype,
email: signupForm.email,
password: signupForm.password,
name: organisationForm.name,
street_name: organisationForm.street_name,
town: organisationForm.town,
postcode: organisationForm.postcode,
};
console.log(data);
/* this.api
.register(data)
.subscribe(
result => {
console.log('registered!');