Cacher is the code snippet organizer for pro developers

Themeleaf

initializaion:

xmlns:th="http://www.thymeleaf.org"

Quick Summary:

> Variable Expressions: ${...}
> Selection Variable Expressions: *{...}
> Message Expressions: #{...}
> Link URL Expressions: @{...}

Literals:

> Text literals: 'one text', 'Another one!',…
> Number literals: 0, 34, 3.0, 12.3,…
> Boolean literals: true, false
> Null literal: null
> Literal tokens: one, sometext, main,…

Text operations:

> String concatenation: +
> Literal substitutions: |The name is ${name}|
> Arithmetic operations:
> Binary operators: +, -, *, /, %
> Minus sign (unary operator): -

Boolean operations:

> Binary operators: and, or
> Boolean negation (unary operator): !, not
> Comparisons and equality:
> Comparators: >, <, >=, <= (gt, lt, ge, le)
> Equality operators: ==, != (eq, ne)

Conditional operators:

> If-then: (if) ? (then)
> If-then-else: (if) ? (then) : (else)
> Default: (value) ?: (defaultvalue)

Link URL Expressions:

@{} example 1:

<link 
rel="stylesheet" 
type="text/css"
media="all"
href="../../css/my.css" 
th:href="@{/css/my.css}" 
/>

example 2:

 <script 
 type="text/javascript" 
 th:src="@{js/main.js}" 
 src="../static/js/main.js"> 
 </script>

Variable from Spring Controller

Controller

  @RequestMapping({ "/index", "", "/", })
  public String init(Model model) {
      model.addAttribute("data", "I am tareq"); //data is the variable name
      
          return "index"; //the html page name or page link
  }

html/template:

 <h1 th:text="${ data}"></h1>

With concat:

   <h1 th:text=" 'Hello ' + ${ data}"></h1>

new link load using thref & link variable:

controller:

     @RequestMapping({ "/tasks" })   
  public String getTasks(Model model) {
          
          model.addAttribute("datas", taskRepository.findAll());
         

      return "tasks";
  }

template/html:

<a
      name="Show tasks"
      id="tasks"
      class="btn btn-primary mt-5 m-auto"
      th:href="@{/tasks}"
      role="button"
      >Show tasks</a>

Foreach loop in thymeleaf:

Spring Controller:

  //tasks page
    @RequestMapping({ "/tasks" })   
  public String getTasks(Model model) {
          
          model.addAttribute("datas", taskRepository.findAll());
         

      return "tasks";
  }

template or html:

   <tr th:each="task: ${datas}">
          <td scope="row" th:text="${task.id}"></td>
          <td th:text="${task.key}"></td>
          <td th:text="${task.value}"></td>
         
        </tr>

Delete an item from table:

Controller:

    @GetMapping("/delete")
  public String deleteTask( Long  id) {
   
      taskRepository.deleteById(id);

      return "redirect:/tasks"; /// here the page in not index its the tasks page for index page use only redirect:/
  }

Html:

 <tr th:each="task:  ${datas}">
          <td scope="row" th:text="${task.id}"></td>
          <td th:text="${task.key}"></td>
          <td th:text="${task.value}"></td>
          <td>
            <a
              name=""
              id=""
              class="btn btn-danger"
              th:href="@{delete/(id=${task.id})}"
              role="button"
              >Delete</a
            >
          </td>
        </tr>

Delete using path vairable

html:

  <tr th:each="task:  ${datas}">
          <td scope="row" th:text="${task.id}"></td>
          <td th:text="${task.key}"></td>
          <td th:text="${task.value}"></td>
          <td>
            <a
              name=""
              id=""
              class="btn btn-danger"
              th:href="@{'delete/'+ ${task.id}}"
               role="button"
              >Delete</a
            >
          </td>
        </tr>

controller:

@GetMapping("/delete/{id}")
  public String deleteTask(@PathVariable Long id) {
      System.out.println("Delete");
    
     
      taskRepository.deleteById(id);

      return "redirect:/tasks";
  }