work on order form

snippets/order.html

@@ -2,6 +2,12 @@
 <script src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
 <script src="static/js/order.js"></script>
 
+<div id="success_message" class="message is-success is-hidden">
+  <div class="message-body">
+    <p class="has-text-weight-bold">Vielen Dank!</p>
+    <p>Ihre Bestellung wird gep&uuml;ft. Sie erhalten die Rechnung per E-Mail. Nach Zahlungseingang wird der Zugang eingerichtet und sie erhalten den/die GPS Tracker per Post mit einem Zugangspasswort.</p>
+  </div>
+</div>
 <div id="modal" class="modal is-active">
   <div class="modal-background"></div>
   <div class="modal-card">
@@ -66,6 +72,7 @@
             <div class="control">
               <textarea class="textarea has-fixed-size" rows="5" maxlength="250" id="delivery_address" placeholder="Lieferadresse" autocomplete="off"></textarea>
             </div>
+            <p id="delivery_address_errormsg" class="help is-danger"></p>
           </div>
         </div>
         <div class="column is-half">
@@ -74,17 +81,25 @@
             <div class="control">
               <textarea class="textarea has-fixed-size" rows="5" maxlength="250" id="billing_address" placeholder="leer lassen, wenn wie Lieferadresse" autocomplete="off"></textarea>
             </div>
+            <p id="billing_address_errormsg" class="help is-danger"></p>
           </div>
         </div>
       </div>
       
       <div class="field">
         <div class="control">
-          <label class="checkbox">
-            <input type="checkbox">
-            Ich stimme den <a href="#">Gesch&auml;ftsbedingungen</a> zu
+          <label id="accept_terms_label" class="checkbox">
+            <input id="accept_terms" type="checkbox">
+            Ich stimme den <a href="static/files/wo-bisch-AGBs.pdf" target="_blank">Gesch&auml;ftsbedingungen</a> zu
           </label>
         </div>
+        <p id="accept_terms_errormsg" class="help is-danger"></p>
+      </div>
+      <div id="error_message" class="message is-danger is-hidden">
+        <div class="message-body">
+          <p class="has-text-weight-bold">Oops!</p>
+          <p>Da ist etwas schiefgegangen... Bitte melden bei Kontaktadresse!</p>
+        </div>
       </div>
     </div>
     <footer class="modal-card-foot">