X-Git-Url: https://juplo.de/gitweb/?a=blobdiff_plain;f=src%2Fmain%2Fresources%2Ftemplates%2Fform.html;h=e3b1f90757280044a589101edf76f05113b9a4ad;hb=804d85a8ec9c52c570320f1e3a135b5bc8019d1d;hp=b8b5158537c232d329498ed84cd7ddf7afcb7aef;hpb=6eb2455c04a509b887754e586bdc50f920011cf1;p=demos%2Fspring-boot

diff --git a/src/main/resources/templates/form.html b/src/main/resources/templates/form.html
index b8b5158..e3b1f90 100644
--- a/src/main/resources/templates/form.html
+++ b/src/main/resources/templates/form.html
@@ -16,17 +16,31 @@
           <div class="card-header">Select / unselect the option and submit the form...</div>
           <div class="card-body">
             <div class="card-text">
-              <div class="form-group">
-                <input type="checkbox" class="form-check-label" th:field="*{option}" />
-                <label class="form-check-label" th:for="${#ids.prev('option')}">Fancy Option To Choose</label>
+              <div class="card my-2">
+                <div class="card-body p-2">
+                  <input type="checkbox" class="form-check-label" th:field="*{option}" />
+                  <label class="form-check-label" th:for="${#ids.prev('option')}">Fancy Option To Choose</label>
+                </div>
               </div>
-              <div class="form-group">
-                <input type="checkbox" class="form-check-label" th:field="*{inner.option}" />
-                <label class="form-check-label" th:for="${#ids.prev('inner.option')}">Another Option (In An Inner Class)</label>
+              <div class="card my-2">
+                <div class="card-body p-2">
+                  <input type="checkbox" class="form-check-label" th:field="*{inner.option}" />
+                  <label class="form-check-label" th:for="${#ids.prev('inner.option')}">Another Option (In An Inner Class)</label>
+                </div>
               </div>
-              <div class="form-group" th:each="key : *{map.keySet()}">
-                <input type="checkbox" class="form-check-label" th:field="*{map[__${key}__]}" />
-                <label class="form-check-label" th:for="|map${key}1|" th:text='|Option "${key}" From The Map|'>Option "KEY" From The Map</label>
+              <div class="card my-2" th:each="key : *{map.keySet()}">
+                <div class="card-body p-2">
+                  <input type="checkbox" class="form-check-label" th:field="*{map[__${key}__]}" />
+                  <label class="form-check-label" th:for="|map${key}1|" th:text='|Option "${key}" From The Map|'>Option "KEY" From The Map</label>
+                  <button type="submit" class="close float-right pr-2" name="remove" th:value="${key}">
+                    <span aria-hidden="true">&times;</span>
+                  </button>
+                </div>
+              </div>
+              <div class="input-group">
+                <span class="input-group-prepend"><span class="input-group-text">New Option</span></span>
+                <input type="input" class="form-control" name="name" />
+                <span class="input-group-append"><button type="submit" class="btn btn-primary" name="add">Add</button></span>
               </div>
             </div>
           </div>