042

src/a3.nim

@@ -422,6 +422,17 @@ import
     val.class = "text-success"
   ctx.send sendZip(zip, val)
 
+"/validation/email" -> post:
+  var email = ctx.urlForm["c_email_address"]
+  var val: Validity
+  if email == "":
+    val.message = "Email is Required"
+    val.class = "text-danger"
+  else:
+    val.message = ""
+    val.class = "text-success"
+  ctx.send sendEmail(email, val)
+
 "/contact" -> get:
   
   var

src/a3a/checkout.nimja

@@ -159,7 +159,6 @@
                 hx-swap="outerHTML"
               >
                 <label for="c_state_country" class="text-black">State / Country <span class="text-danger">*</span></label>
-                {# <label class="text-danger">{{stateError}}</label> #}
                 <input type="text" class="form-control" id="c_state_country"
                   hx-post="/validation/state"
                   name="c_state_country"
@@ -181,10 +180,17 @@
             </div>
 
             <div class="form-group row mb-5">
-              <div class="col-md-6">
+              <div
+                class="col-md-6"
+                hx-target="this"
+                hx-swap="outerHTML"
+              >
                 <label for="c_email_address" class="text-black">Email Address <span class="text-danger">*</span></label>
-                <label class="text-danger">{{emailError}}</label>
-                <input type="text" class="form-control" id="c_email_address" name="c_email_address">
+                {# <label class="text-danger">{{emailError}}</label> #}
+                <input type="text" class="form-control" id="c_email_address"
+                  hx-post="/validation/email"
+                  name="c_email_address"
+                >
               </div>
               <div class="col-md-6">
                 <label for="c_phone" class="text-black">Phone <span class="text-danger">*</span></label>

src/a3pkg/htmx.nim

@@ -89,4 +89,21 @@ proc sendZip*(zip: string, input: Validity): string =
         value="{zip}"
       >
     </div>
+  """
+
+proc sendEmail*(email: string, input: Validity): string =
+  result = fmt"""
+    <div
+      class="col-md-12"
+      hx-target="this"
+      hx-swap="outerHTML"
+    >
+      <label for="c_email" class="text-black">Email <span class="text-danger">*</span></label>
+      <label class="{input.class}">{input.message}</label>
+      <input type="text" class="form-control" id="c_email_address"
+        hx-post="/validation/email"
+        name="c_email_address"
+        value="{email}"
+      >
+    </div>
   """