From 192ea60b82806669fd633888fe9641f24bd5abd3 Mon Sep 17 00:00:00 2001
From: Chocobozzz <florian.bigard@gmail.com>
Date: Sat, 4 Jun 2016 13:31:23 +0200
Subject: Improve the login form

---
 client/src/app/login/login.component.html | 24 ++++++++++++++++++++----
 1 file changed, 20 insertions(+), 4 deletions(-)

(limited to 'client/src/app/login/login.component.html')

diff --git a/client/src/app/login/login.component.html b/client/src/app/login/login.component.html
index 940694515..5848fcba3 100644
--- a/client/src/app/login/login.component.html
+++ b/client/src/app/login/login.component.html
@@ -1,14 +1,30 @@
 <h3>Login</h3>
-<form role="form" (submit)="login(username.value, password.value)">
+
+
+<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+
+<form role="form" (ngSubmit)="login(username.value, password.value)" #loginForm="ngForm">
   <div class="form-group">
     <label for="username">Username</label>
-    <input type="text" #username class="form-control" id="username" placeholder="Username">
+    <input
+      type="text" class="form-control" name="username" id="username" placeholder="Username" required
+      ngControl="username" #username="ngForm"
+    >
+    <div [hidden]="username.valid || username.pristine" class="alert alert-danger">
+      Username is required
+    </div>
   </div>
 
   <div class="form-group">
     <label for="password">Password</label>
-    <input type="password" #password class="form-control" id="password" placeholder="Password">
+    <input
+      type="password" class="form-control" name="password" id="password" placeholder="Password" required
+      ngControl="password" #password="ngForm"
+    >
+    <div [hidden]="password.valid || password.pristine" class="alert alert-danger">
+      Password is required
+    </div>
   </div>
 
-  <input type="submit" value="Login" class="btn btn-default">
+  <input type="submit" value="Login" class="btn btn-default" [disabled]="!loginForm.form.valid">
 </form>
-- 
cgit v1.2.3