Video 58: Creating a Search Form

web-server/public/js/app.js

@@ -1,12 +1,21 @@
 console.log('Client side javascript file is loaded!')
 
-fetch('/weather?address=boston').then((response) => {
-  response.json().then((data) => {
-    if (data.error) {
-      console.log(data.error)
-    } else {
-      console.log(data.location)
-      console.log(data.forecast)
-    }
+const weatherForm = document.querySelector('form')
+const search = document.querySelector('input')
+
+weatherForm.addEventListener('submit', (e) => {
+  e.preventDefault()
+
+  const location = search.value
+
+  fetch('/weather?address=' + location).then((response) => {
+    response.json().then((data) => {
+      if (data.error) {
+        console.log(data.error)
+      } else {
+        console.log(data.location)
+        console.log(data.forecast)
+      }
+    })
   })
 })