Files
2015-12-10 22:52:55 -06:00

60 lines
1.7 KiB
HTML

<ion-toolbar><ion-title>Inline Label Text Input</ion-title></ion-toolbar>
<ion-content>
<form (ng-submit)="submit($event)" [ngFormModel]="loginForm" #mf="ngForm" novalidate>
<ion-list>
<ion-input>
<ion-label>Email:</ion-label>
<input [(ngModel)]="login.email" ngControl="email" type="email" placeholder="Required" required>
<button clear item-right>
<icon mail></icon>
</button>
</ion-input>
<ion-input>
<ion-label>Username:</ion-label>
<input [(ngModel)]="login.username" ngControl="username" type="text" placeholder="Optional">
<button clear item-right>
<icon person></icon>
</button>
</ion-input>
<ion-input>
<ion-label>Password:</ion-label>
<input [(ngModel)]="login.password" ngControl="password" type="password" placeholder="Required" required>
<button clear item-right>
<icon lock></icon>
</button>
</ion-input>
<ion-input>
<ion-label>Comments:</ion-label>
<textarea [(ngModel)]="login.comments" ngControl="comments" placeholder="Required" required>Comment value</textarea>
</ion-input>
<ion-item [hidden]="submitted == false || mf.form.valid">
<p danger>Form is Invalid</p>
</ion-item>
</ion-list>
<div padding>
<button block type="submit">Login</button>
</div>
<div [hidden]="submitted == false" padding-left>
<b>Valid form?:</b> {{ mf.form.valid }}<br>
<b>Submitted form?:</b> {{ submitted }}<br>
<b>Email:</b> {{ login.email }}<br>
<b>Username:</b> {{ login.username }}<br>
<b>Password:</b> {{ login.password }}<br>
<b>Comments:</b> {{ login.comments }}
</div>
</form>
</ion-content>