55 lines
1.2 KiB
Plaintext
55 lines
1.2 KiB
Plaintext
|
package deleterow
|
||
|
|
|
||
|
|
import "examples/shared"
|
||
|
|
|
||
|
|
templ demo() {
|
||
|
|
<style>
|
||
|
|
tr.htmx-swapping td {
|
||
|
|
opacity: 0;
|
||
|
|
transition: opacity 1s ease-out;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<table class="table"><thead>
|
||
|
|
<tr>
|
||
|
|
<th>Name</th>
|
||
|
|
<th>Email</th>
|
||
|
|
<th>Status</th>
|
||
|
|
<th></th>
|
||
|
|
</tr>
|
||
|
|
</thead><tbody hx-confirm="Are you sure?" hx-target="closest tr" hx-swap="outerHTML swap:1s">
|
||
|
|
<tr>
|
||
|
|
<td>Joe Smith</td>
|
||
|
|
<td>joe@smith.org</td>
|
||
|
|
<td>Active</td>
|
||
|
|
<td><button class="button is-red" hx-delete="/delete-row/contact/0">Delete</button></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Angie MacDowell</td>
|
||
|
|
<td>angie@macdowell.org</td>
|
||
|
|
<td>Active</td>
|
||
|
|
<td><button class="button is-red" hx-delete="/delete-row/contact/1">Delete</button></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Fuqua Tarkenton</td>
|
||
|
|
<td>fuqua@tarkenton.org</td>
|
||
|
|
<td>Active</td>
|
||
|
|
<td><button class="button is-red" hx-delete="/delete-row/contact/2">Delete</button></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Kim Yee</td>
|
||
|
|
<td>kim@yee.org</td>
|
||
|
|
<td>Inactive</td>
|
||
|
|
<td><button class="button is-red" hx-delete="/delete-row/contact/3">Delete</button></td>
|
||
|
|
</tr>
|
||
|
|
</tbody></table>
|
||
|
|
}
|
||
|
|
|
||
|
|
templ Index() {
|
||
|
|
@shared.Layout("Delete Row") {
|
||
|
|
<h2 class="title">Delete Row</h2>
|
||
|
|
<h2 class="title">Demo</h2>
|
||
|
|
@demo()
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|