Adding fields to the check out form.
authorSteve Sutton <steve@gaslightmedia.com>
Fri, 20 Oct 2017 14:36:17 +0000 (10:36 -0400)
committerSteve Sutton <steve@gaslightmedia.com>
Fri, 20 Oct 2017 14:36:17 +0000 (10:36 -0400)
This is just to get started for the checkout form.

views/front/registrations/checkout.html

index 8a723d9..d69725c 100644 (file)
@@ -2,15 +2,82 @@
 
 {if $haveCart}
     <form>
+        {* Hidden fields go here *}
 
-    <table width="100%">
+    <div class="glm-reg-checkout">
 
-        <tr><th>Name:</th><td><input type="text" name="name"></td></tr>
+        <h3>Checkout</h3>
+
+        <h4>Account Information</h4>
+        <div>
+            <input type="email" class="glm-form-input" placeholder="*Email Address" name="email" value="" required>
+            <input type="password" class="glm-form-input" placeholder="*Password" name="password" value="" required>
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="*First Name" name="fname" value="{$reg.fname}" required>
+            <input class="glm-form-input" placeholder="*Last Name" name="lname" value="{$reg.lname}" required>
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="Address 1" name="addr1" value="{$reg.addr1}" required>
+            <input class="glm-form-input" placeholder="Address 2" name="addr2" value="{$reg.addr2}">
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="City" name="city" value="{$reg.city}" required>
+            <input class="glm-form-input" placeholder="State" name="state" value="{$reg.state}" required>
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="Zip/Postal Code" name="zip" value="{$reg.zip}" required>
+            <input class="glm-form-input" placeholder="Country" name="country" value="{$reg.country}">
+        </div>
+
+        <h4>Billing Information</h4>
+        <div>
+            <input class="glm-form-input" placeholder="*First Name" name="bill_fname" value="{$reg.bill_fname}" required>
+            <input class="glm-form-input" placeholder="*Last Name" name="bill_lname" value="{$reg.bill_lname}" required>
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="Address 1" name="bill_addr1" value="{$reg.bill_addr1}" required>
+            <input class="glm-form-input" placeholder="Address 2" name="bill_addr2" value="{$reg.bill_addr2}">
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="City" name="bill_city" value="{$reg.bill_city}" required>
+            <input class="glm-form-input" placeholder="State" name="bill_state" value="{$reg.bill_state}" required>
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="Zip/Postal Code" name="bill_zip" value="{$reg.bill_zip}" required>
+            <input class="glm-form-input" placeholder="Country" name="bill_country" value="{$reg.bill_country}">
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="Phone" name="bill_phone" value="{$reg.bill_phone}" required>
+            <input class="glm-form-input" placeholder="Fax" name="bill_fax" value="{$reg.bill_fax}">
+        </div>
+
+        <h4>Contact Information</h4>
+        <div>
+            <input class="glm-form-input" placeholder="*First Name" name="contact_fname" value="{$reg.contact_fname}">
+            <input class="glm-form-input" placeholder="*Last Name" name="contact_lname" value="{$reg.contact_lname}">
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="Address 1" name="contact_addr1" value="{$reg.contact_addr1}">
+            <input class="glm-form-input" placeholder="Address 2" name="contact_addr2" value="{$reg.contact_addr2}">
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="City" name="contact_city" value="{$reg.contact_city}">
+            <input class="glm-form-input" placeholder="State" name="contact_state" value="{$reg.contact_state}">
+        </div>
+        <div>
+            <input class="glm-form-input" placeholder="Zip/Postal Code" name="contact_zip" value="{$reg.contact_zip}">
+            <input class="glm-form-input" placeholder="Country" name="contact_country" value="{$reg.contact_country}">
+        </div>
+        <div>
+            <input type="email" class="glm-form-input" placeholder="Email Address" name="contact_email" value="{$reg.contact_email}">
+            <input type="email" class="glm-form-input" placeholder="Phone" name="contact_phone" value="{$reg.contact_phone}">
+        </div>
+
+    </div>
 
-    </table>
-    
     <div style="text-align: right;"><h2>Total Charged: ${$cart.totalCharges|number_format:2}</h2></div>
-    
+
     {if $cart.blockCheckout}
     <div>
         <div class="glm-reg-warning">You have not yet submitted your registration. See above for issues! <img src="{$assetUrl}/fingerUpRed.svg" style="height: 2em;"></div>
         or <a href="{$regUrl}?page=cart" class="button tiny">Return to Cart</a>
     </div>
     {/if}
-    
+
     </form>
-    
+
     <table class="glm-admin-table" width="100%">
-    
+
         <thead>
-        
+
             <tr>
                 <th>Registering</th>
                 <th>Registrant</th>
                 <th>Discount</th>
                 <th>Rate</th>
             </tr>
-        
-        
+
+
         </thead>
         <tbody>
   {foreach $cart.events as $event}
             <tr>
                 <th colspan="5">Event: {$event.event_name}</th>
-            </tr>        
+            </tr>
     {foreach $event.classes as $class}
             <tr>
                 <td colspan="5">&nbsp;&nbsp;&nbsp;&nbsp;{$class.class_name}</td>
                     - Base Rate ({$rate.registrant_credits} registrants included)
                 </td>
                 <td style="text-align: right;">{$rate.rateBaseCharge|number_format:2}</td>
-            </tr>      
+            </tr>
         {foreach $rate.registrants as $registrant}
             <tr>
                 <td>&nbsp;</td>
                 </td>
             </tr>
         {/foreach}
-      {/foreach}          
+      {/foreach}
     {/foreach}
-  {/foreach} 
+  {/foreach}
             <tfoot>
                 <td colspan="2">&nbsp;</td>
                 <td>Total registrants: {$cart.totalRegistrants}</td>
                 </td>
                 <td style="text-align: right;">${$cart.totalCharges|number_format:2}</td>
             </tfoot>
-         
+
         </tbody>
+
     </table>
-    
+
 {else}
             <tr class="alternate"><td colspan="2">No cart data</td></tr>
 {/if}