I have this registration form in my Ionic App. The weird thing is that when the form opens, the focus always gets moved to the field which has Last 4 digits of SSN and the keyboard opens up. There is no code in the .TS file which can cause this. In fact I tried adding keyboard.close in IonViewDidEnter and even that doesn’t work
ionViewDidEnter() {
this.platform.ready().then(() => {
setTimeout(() => this.keyboard.close(), 200);
});
}
<form (ngSubmit)="doRegister()">
<div>
<ion-item text-wrap>
Sign-up
<br>
</ion-item>
<ion-item>
<ion-label floating>First Name</ion-label>
<ion-input type="text" [(ngModel)]="_register.firstName" name="firstName"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Last Name</ion-label>
<ion-input type="text" [(ngModel)]="_register.lastName" name="lastName"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Last 4 digits of SSN/Tax ID</ion-label>
**<ion-input type="text" [(ngModel)]="_register.ssn" name="ssn"></ion-input>**
</ion-item>
<ion-item>
<ion-label floating>Date of Birth /Incorporation</ion-label>
<ion-input type="text" [(ngModel)]="_register.dob" name="dob"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Email</ion-label>
<ion-input type="text" [(ngModel)]="_register.email" name="email"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Password</ion-label>
<ion-input type="password" [(ngModel)]="_register.password" name="password"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Confirm Password</ion-label>
<ion-input type="password" [(ngModel)]="_register.confirmPassword" name="confirmPassword"></ion-input>
</ion-item>
<ion-item text-wrap>
<ion-label>View and accept Terms & Conditions</ion-label>
<ion-toggle (ionChange)="termsConditionsCheckClicked($event)" [(ngModel)]="_register.termsAndConditionsAccepted" name="termsAndConditionsAccepted"></ion-toggle>
</ion-item>
<ion-buttons end margin-right>
<input type="button" value="Log in" ion-button outline (click)="gotoLogin()">
<button ion-button type="submit">
<span class="buttonText">Sign up</span>
</button>
</ion-buttons>
</div>
</form>