From 640adfce1802c3f613762ebe7a939e007005acc6 Mon Sep 17 00:00:00 2001 From: gap95 Date: Fri, 29 Nov 2019 16:21:39 +0100 Subject: [PATCH 1/2] Added form validation in Registraion page --- src/app/app.module.ts | 3 + src/app/auth/login/login.page.html | 5 +- src/app/auth/login/login.page.scss | 5 +- src/app/auth/register/register.module.ts | 4 +- src/app/auth/register/register.page.html | 94 ++++++++++++++++-------- src/app/auth/register/register.page.scss | 11 +++ src/app/auth/register/register.page.ts | 35 ++++++++- src/app/feedback/feedback.page.html | 42 +++++++++++ 8 files changed, 161 insertions(+), 38 deletions(-) create mode 100644 src/app/feedback/feedback.page.html diff --git a/src/app/app.module.ts b/src/app/app.module.ts index acf47d2..ef48ea6 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -16,6 +16,7 @@ import { AppComponent } from './app.component'; import { AppRoutingModule } from './app-routing.module'; import { RestService } from './rest.service'; import { ToastService } from './services/toast.service'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; @NgModule({ declarations: [AppComponent], @@ -25,6 +26,8 @@ import { ToastService } from './services/toast.service'; HttpClientModule, IonicModule.forRoot(), AppRoutingModule, + FormsModule, + ReactiveFormsModule, IonicStorageModule.forRoot() ], providers: [ diff --git a/src/app/auth/login/login.page.html b/src/app/auth/login/login.page.html index 76da513..5562a83 100644 --- a/src/app/auth/login/login.page.html +++ b/src/app/auth/login/login.page.html @@ -11,7 +11,10 @@
- +
+

Login

+ +
diff --git a/src/app/auth/login/login.page.scss b/src/app/auth/login/login.page.scss index 4ad0642..e656e08 100644 --- a/src/app/auth/login/login.page.scss +++ b/src/app/auth/login/login.page.scss @@ -6,4 +6,7 @@ ion-item { #correctCredentialsmsg{ color:red; font-size: 14px; -} \ No newline at end of file +} +.ion-text{ + text-align: center; + } \ No newline at end of file diff --git a/src/app/auth/register/register.module.ts b/src/app/auth/register/register.module.ts index 0b18f97..04c075b 100644 --- a/src/app/auth/register/register.module.ts +++ b/src/app/auth/register/register.module.ts @@ -1,6 +1,5 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; -import { FormsModule } from '@angular/forms'; import { IonicModule } from '@ionic/angular'; @@ -8,11 +7,14 @@ import { RegisterPageRoutingModule } from './register-routing.module'; import { RegisterPage } from './register.page'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; + @NgModule({ imports: [ CommonModule, FormsModule, IonicModule, + ReactiveFormsModule, RegisterPageRoutingModule ], declarations: [RegisterPage] diff --git a/src/app/auth/register/register.page.html b/src/app/auth/register/register.page.html index 49983a6..24e2c87 100644 --- a/src/app/auth/register/register.page.html +++ b/src/app/auth/register/register.page.html @@ -5,38 +5,68 @@ - - - -
- -
+ +
+ + + +
+ +
+
+

Registration

+ +
+ + +
+
+ First Name is required. +
+
+ + + + +
+
+ Last Name is required. +
+
+ + +
+
+ Email is required. +
+
-
- - - - - - - - - + + +
+
+ Password is required. +
+
+ + +
+ Wrong Credentials ! +
- - - - -
- -
- Wrong Credentials ! -
- -
- Register -
-
-
-
+
+ Register +
+ + + +
\ No newline at end of file diff --git a/src/app/auth/register/register.page.scss b/src/app/auth/register/register.page.scss index e69de29..d528771 100644 --- a/src/app/auth/register/register.page.scss +++ b/src/app/auth/register/register.page.scss @@ -0,0 +1,11 @@ +.alert-danger{ + color: red; + } + ion-item { + border: solid 1px lightgray; + border-radius: 10px; + margin-bottom: 10px; +} +.ion-text{ + text-align: center; +} diff --git a/src/app/auth/register/register.page.ts b/src/app/auth/register/register.page.ts index bfa94bb..96152e1 100644 --- a/src/app/auth/register/register.page.ts +++ b/src/app/auth/register/register.page.ts @@ -2,7 +2,9 @@ import { Component, OnInit } from '@angular/core'; import { Observable } from 'rxjs'; import { HttpClient } from '@angular/common/http'; import { RestService } from 'src/app/rest.service'; +import { ToastService } from '../../services/toast.service'; import { Router } from '@angular/router'; +import { FormGroup, FormBuilder, Validators } from '@angular/forms'; @Component({ selector: 'app-register', @@ -10,7 +12,7 @@ import { Router } from '@angular/router'; styleUrls: ['./register.page.scss'], }) export class RegisterPage implements OnInit { - + public angForm: FormGroup; registerApi: Observable; correctCredentials: boolean; @@ -18,11 +20,35 @@ export class RegisterPage implements OnInit { password: ""; lastName: ""; firstName: ""; - constructor(private router: Router, public httpClient: HttpClient, public restService: RestService) { } + + constructor(private router: Router, + public httpClient: HttpClient, + public restService: RestService, + private toastService: ToastService, + private fb: FormBuilder) { + this.createForm(); + + } ngOnInit() { + } + createForm() { + this.angForm = this.fb.group({ + firstName: ['',[ Validators.required ]], + lastName: ['', [Validators.required ]], + email: ['',[ Validators.required, Validators.email]], + password: ['', [Validators.required,Validators.minLength(4) ]], + + + + }); + } submitRegister() { + if (this.angForm.invalid) { + return; + } + this.registerApi = this.httpClient.post('http://193.196.52.237:8081/register', { "email": this.email, "password": this.password, @@ -33,10 +59,13 @@ export class RegisterPage implements OnInit { .subscribe((data) => { console.log('my data: ', data); this.restService.setToken(data.token); + this.toastService.showToast("Registration Successful!") this.router.navigateByUrl('/login'); + }, (error) => { console.log(error); - this.correctCredentials = true; + this.toastService.showToast("Registration failed!") + }); } } diff --git a/src/app/feedback/feedback.page.html b/src/app/feedback/feedback.page.html new file mode 100644 index 0000000..12e159d --- /dev/null +++ b/src/app/feedback/feedback.page.html @@ -0,0 +1,42 @@ + + + feedback + + + + + + + +
+ +
+ +
+ + + + + + + + + + + + + + +
+ +
+ Wrong Credentials ! +
+ +
+ Register +
+
+
+
+
-- GitLab From 2fd7d6a506ab7ce4cd35ead1e9f705aa77cb0f0d Mon Sep 17 00:00:00 2001 From: gap95 Date: Fri, 29 Nov 2019 16:25:46 +0100 Subject: [PATCH 2/2] Suggested changes done --- src/app/feedback/feedback.page.html | 42 ----------------------------- 1 file changed, 42 deletions(-) delete mode 100644 src/app/feedback/feedback.page.html diff --git a/src/app/feedback/feedback.page.html b/src/app/feedback/feedback.page.html deleted file mode 100644 index 12e159d..0000000 --- a/src/app/feedback/feedback.page.html +++ /dev/null @@ -1,42 +0,0 @@ - - - feedback - - - - - - - -
- -
- -
- - - - - - - - - - - - - - -
- -
- Wrong Credentials ! -
- -
- Register -
-
-
-
-
-- GitLab