2 <html lang="en" xmlns:th="http://www.thymeleaf.org">
5 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6 <title>Demo: Behavior Of A Checkbox</title>
7 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
10 <nav class="navbar navbar-dark bg-primary navbar-expand navbar-dark flex-column">
11 <h1 class="navbar-brand">Demo: Behavior Of A Checkbox</h1>
13 <main class="container mt-5">
14 <form action="#" th:action="@{/}" th:object="${form}" method="get">
15 <div class="card my-3">
16 <div class="card-header">Select / unselect the option and submit the form...</div>
17 <div class="card-body">
18 <div class="card-text">
19 <div class="form-group">
20 <input type="checkbox" class="form-check-label" th:field="*{option}" />
21 <label class="form-check-label" th:for="${#ids.prev('option')}">Fancy Option To Choose</label>
23 <div class="form-group">
24 <input type="checkbox" class="form-check-label" th:field="*{inner.option}" />
25 <label class="form-check-label" th:for="${#ids.prev('inner.option')}">Another Option (In An Inner Class)</label>
27 <div class="form-group" th:each="key : *{map.keySet()}">
28 <input type="checkbox" class="form-check-label" th:field="*{map[__${key}__]}" />
29 <!-- <label class="form-check-label" th:for="${#ids.prev('map[__${key}__]')}" th:text='|Option "${key}" From The Map|'>Option "KEY" From The Map</label>-->
30 <label class="form-check-label" th:text='|Option "${key}" From The Map|'>Option "KEY" From The Map</label>
34 <div class="card-footer">
35 <button type="submit" class="btn btn-primary">Submit</button>