From 59dbf2865bd74aed605990024ec48a5ab578af05 Mon Sep 17 00:00:00 2001
From: Ignatus Arkoh Amoah <amoahdevlabs@gmail.com>
Date: Sun, 6 Feb 2022 10:02:33 -0500
Subject: [PATCH] Resetting the input field

The script before the close of the endblock content tag resets the form after submission. Note: a CSS class with the 'title' is added to the list of classes in the input field.
---
 Video #6.1/films/templates/films.html | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/Video #6.1/films/templates/films.html b/Video #6.1/films/templates/films.html
index 6fb23a03..73f7a53d 100644
--- a/Video #6.1/films/templates/films.html	
+++ b/Video #6.1/films/templates/films.html	
@@ -9,7 +9,7 @@
             <input type="text" 
                 id="filmname-input"
                 name="filmname" 
-                class="form-control-sm mr-2" 
+                class="title form-control-sm mr-2" 
                 placeholder="Enter a film" />
             <button type="submit" class="btn btn-success btn-sm">Add Film</button>
         </form>
@@ -22,4 +22,9 @@
         </section>
     </main>
 </div>
-{% endblock content %}
\ No newline at end of file
+    <script>
+        document.body.addEventListener('htmx:afterRequest', (event) => {
+            document.querySelector("input.title").value = '';
+        });
+    </script>
+{% endblock content %}