demo.htmx.org to simulate server responses
based on the
<template url="..."> elements defined
at the end of the page. In production, these requests
would go to a real server. All state in this demo lives
in the page's HTML (the table rows themselves).
A customers table with row editing in a dialog
(hx-layer="new" +
hx-layer="return") and a per-row action that
opens a multi-step wizard
(hx-layer="step",
hx-layer-back,
hx-layer="replace"). Creating a new customer
is itself a two-step wizard that appends a row to the
table.
| ID | Name | Type | Phone | Actions | |
|---|---|---|---|---|---|
| 1 | Ana García | Person | ana@example.com | 600111222 | |
| 2 | Acme Corp | Company | contact@acme.com | 912345678 | |
| 3 | Carlos Ruiz | Person | carlos@example.com | 611222333 | |
Recipient: ${nombre} (${email})
Template: ${({welcome: 'Welcome', promo: 'Promotion', reminder: 'Payment reminder'})[plantilla] || plantilla}
📨 Connecting to mail server…
✉️ Sending to ${email}…
✅ Email sent to ${nombre}.