# Error while validating, error messages not showing

**URL:** <https://forum.ionicframework.com/t/error-while-validating-error-messages-not-showing/137343>\
**Category:** ionic-v3\
**Created:** [August 4, 2018, 4:04am UTC](https://forum.ionicframework.com/t/error-while-validating-error-messages-not-showing/137343 "2018-08-04T04:04:17Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![mah-rakib](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mah-rakib/32/120748_2.png) [@mah-rakib](https://forum.ionicframework.com/u/mah-rakib)\
**Post date:** [August 4, 2018, 4:04am UTC](https://forum.ionicframework.com/t/error-while-validating-error-messages-not-showing/137343/1 "2018-08-04T04:04:17Z")

</div>

In my sign up page, when wrong inputs are given, ionic error page is shown instead of the error messages embedded in the html.  
error Message:

```auto
TypeError: Cannot read property 'value' of undefined

```

this is my sign-up.html page

```auto
<ion-header>
  <ion-navbar color="grey">
    <ion-title>
      Create an Account
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <form [formGroup]="signupForm" (submit)="signupUser()" novalidate>

    <ion-item>
      <ion-label stacked>Email</ion-label>
      <ion-input formControlName="email" type="email" placeholder="Your email address" [class.invalid]="!signupForm.controls.email.valid && signupForm.controls.email.dirty"></ion-input>
    </ion-item>
    <ion-item class="error-message" *ngIf="!signupForm.controls.email.valid && signupForm.controls.email.dirty">
      <p>Please enter a valid email.</p>
    </ion-item>

    <ion-item>
      <ion-label stacked>Password</ion-label>
      <ion-input formControlName="password" type="password" placeholder="Your password" [class.invalid]="!signupForm.controls.password.valid && signupForm.controls.password.dirty"></ion-input>
    </ion-item>
    <ion-item class="error-message" *ngIf="!signupForm.controls.password.valid && signupForm.controls.password.dirty">
      <p>Your password needs more than 6 characters.</p>
    </ion-item>

    <button ion-button block type="submit">
      Create an Account
    </button>

  </form>

</ion-content>

```

And this is my sign-up.ts code

```auto
import { Component } from '@angular/core';
import {
	IonicPage,
	NavController,
	LoadingController,
	Loading,
	AlertController
} from 'ionic-angular';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
import { AuthProvider } from '../../providers/auth/auth';
import { HomePage } from '../home/home';
import { EmailValidator } from '../../validators/email';
@IonicPage()
@Component({
	selector: 'page-sign-up',
	templateUrl: 'sign-up.html'
})
export class SignUpPage {
	public signupForm: FormGroup;
	public loading: Loading;

	constructor (
		public nav: NavController,
		public authData: AuthProvider,
		public formBuilder: FormBuilder,
		public loadingCtrl: LoadingController,
		public alertCtrl: AlertController
	) {
		this.signupForm = formBuilder.group({
			email:
				[
					'',
					Validators.compose([
						Validators.required,
						EmailValidator.isValid
					])
				],
			password:
				[
					'',
					Validators.compose([
            Validators.minLength(6),
            Validators.maxLength(50),
						Validators.required
					])
				]
    });
	}

	signupUser () {
    if (this.signupForm.contains['email'].value=="" || this.signupForm.contains['password']=="") {
			this.alertCtrl.create({
				title: 'Blank input value',
				message: 'Please fill up the form',
				buttons:
					[
						'OK'
					]
			});
		}
		else {
			if (!this.signupForm.valid) {
			}
			else {
				this.authData.signupUser(this.signupForm.value.email, this.signupForm.value.password).then(
					() => {
						this.nav.setRoot('ReceiveServiceListPage');
					},
					(error) => {
						this.loading.dismiss().then(() => {
							var errorMessage: string = error.message;
							let alert = this.alertCtrl.create({
								message: errorMessage,
								buttons:
									[
										{
											text: 'Ok',
											role: 'cancel'
										}
									]
							});
							alert.present();
						});
					}
				);

				this.loading = this.loadingCtrl.create({
					dismissOnPageChange: true
				});
				this.loading.present();
			}
		}
	}
}

```

What is the cause of the error?  
How can i solve this?

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 9:26pm UTC](https://forum.ionicframework.com/t/error-while-validating-error-messages-not-showing/137343/2 "2021-07-19T21:26:11Z")

</div>

Closed on July 19, 2021, 9:26pm UTC


