Skip to content

Commit

Permalink
#98 - Enable htmx-request again adding hint for the dialect
Browse files Browse the repository at this point in the history
Fix the syntax to enable the processing of the htmx-request
Add comment and link to the thymeleaf htmx processing
  • Loading branch information
OliverGeisel committed Sep 30, 2024
1 parent 6494263 commit 83e542b
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 3 deletions.
2 changes: 2 additions & 0 deletions readme.adoc
Original file line number Diff line number Diff line change
Expand Up @@ -148,3 +148,5 @@ Library to build dynamic web applications using HTML and JavaScript (AJAX).

- https://htmx.org[Overview]
- https://htmx.org/docs[Tutorial-Documentation]
- Special Thymeleaf dialect to integrate HTMX:
https://github.com/wimdeblauwe/htmx-spring-boot[Github]
7 changes: 4 additions & 3 deletions src/main/resources/templates/guestbook.html
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,9 @@ <h1 class="text-center" th:text="#{guestbook.title}">Gästebuch</h1>
<div class="card-header">
<form sec:authorize="hasRole('ADMIN')" th:method="delete" th:action="@{/guestbook/{id}(id=${entry.id})}" th:attr="data-entry-id=${entry.id}">
<button th:title="#{guestbook.form.delete}" class="btn btn-sm float-right"
hx-delete="@{/guestbook/{id}(id=${entry.id})}"
hx-target="'#entries'">
hx:delete="@{/guestbook/{id}(id=${entry.id})}" hx-target="#entries">
<!-- the ':' is necessary, when Thymeleaf expression is used
this dialect is enabled by htmx-spring-boot-thymeleaf dependency in pom-->
<span class="fas fa-times"></span>
</button>
</form>
Expand All @@ -43,7 +44,7 @@ <h4 th:text="${index} + '. ' + ${entry.name}" class="card-title">1. Posting</h4>
</div>
</div>

<form method="post" role="form" class="gb-form" id="form" hx-post="@{/guestbook}" hx-target="#entries"
<form method="post" role="form" class="gb-form" id="form" hx-post="/guestbook" hx-target="#entries"
hx-swap="beforeend" _="on entryAdded me.reset()" th:action="@{/guestbook}" th:object="${form}">
<div class="form-group">
<label for="name" th:text="#{guestbook.form.name}">Name</label><br />
Expand Down

0 comments on commit 83e542b

Please sign in to comment.