From c2010d69c6abeebb074f5294db51d69b77a0a3a6 Mon Sep 17 00:00:00 2001
From: Minhao Qiu <minhao.qiu@fau.de>
Date: Mon, 29 Jul 2019 21:37:49 +0200
Subject: [PATCH] improve the robustness of task.htmk

---
 app_7/task.html | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/app_7/task.html b/app_7/task.html
index fc8d368..62ffd95 100644
--- a/app_7/task.html
+++ b/app_7/task.html
@@ -2,10 +2,21 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>Title</title>
+    <title>Todo List</title>
     <script>
     document.addEventListener("DOMContentLoaded", () => {
 
+        // By default, submit button is disabled
+        document.querySelector("#submit").disabled = true;
+
+        // Enable the button only if there is text in the input field
+        document.querySelector("#task").onkeyup = () => {
+            if (document.querySelector('#task').value.length > 0)
+                document.querySelector("#submit").disabled = false;
+            else
+                document.querySelector("#submit").disabled = true;
+        };
+
         document.querySelector("#new-task").onsubmit = () => {
 
             const li = document.createElement("li");
@@ -14,8 +25,9 @@
             // add new item to the task list
             document.querySelector("#tasks").append(li);
 
-            // clear the input field
+            // clear the input field and disabled button again
             document.querySelector("#task").value = "";
+            document.querySelector("#submit").disabled = true;
 
             // stop form from submitting
             return false;
@@ -30,7 +42,7 @@
     </ul>
     <form id="new-task">
         <input id="task" autocomplete="off" autofocus placeholder="New Task" type="text">
-        <input type="submit">
+        <input id="submit" type="submit">
     </form>
 </body>
 </html>
\ No newline at end of file
-- 
GitLab