allow form submission

Author: wagslane

layouts/partials/newsletter.html

@@ -2,7 +2,10 @@
   <p class="mb-2 mt-1 text-lg text-gray-200">
     Subscribe to curated backend podcasts, videos and articles. All free.
   </p>
-  <div class="grid grid-cols-2 md:grid-cols-6 gap-2">
+  <form
+    class="grid grid-cols-2 md:grid-cols-6 gap-2"
+    onsubmit="newsletterSubmit(event)"
+  >
     <input
       id="newsletterFName"
       type="text"
@@ -16,9 +19,8 @@
       class="rounded p-2 bg-gray-750 w-full col-span-1 md:col-span-3"
     />
     <button
-      p
+      type="submit"
       class="block-button-secondary col-span-2 md:col-span-1"
-      onclick="newsletterClick()"
     >
       Subscribe
     </button>
@@ -27,11 +29,13 @@
       id="newsletterSuccess"
       class="text-yellow-650 col-span-2 md:col-span-6"
     ></p>
-  </div>
+  </form>
 </div>
 
 <script>
-  async function newsletterClick() {
+  async function newsletterSubmit(event) {
+    event.preventDefault();
+
     const newsletterFName = document.getElementById("newsletterFName").value;
     const newsletterEmail = document.getElementById("newsletterEmail").value;
     document.getElementById("newsletterError").innerText = null;
@@ -56,7 +60,7 @@
       document.getElementById("newsletterSuccess").innerText =
         "You're subscribed!";
     } catch (err) {
-      document.getElementById("newsletterError").value =
+      document.getElementById("newsletterError").innerText =
         "Invalid contact information";
     }
   }