Validasi form di HTMX biasanya dilakukan di server, dengan inline error response.

Server-side Validation

<form hx-post="/api/register" hx-target="#form-result">
  <input name="email" required />
  <input name="password" required />
  <button>Daftar</button>
</form>
<div id="form-result"></div>

Response: Error

<!-- Server mengembalikan form dengan error messages -->
<div class="error">
  <p>Email sudah terdaftar</p>
</div>

Response: Success

<div class="success">
  <p>Registrasi berhasil!</p>
</div>

Inline Validation

Selain validasi saat submit, kamu juga bisa validasi per field — mis. cek apakah email sudah terdaftar saat user selesai mengetik. Mekanismenya tetap sama (request ke server, dapat HTML kembali), tapi dipicu per field dengan hx-trigger="blur":

<input name="email" hx-post="/api/validate-email"
       hx-trigger="blur" hx-target="next .error" />
<span class="error"></span>

Validasi terjadi saat user pindah dari field — server mengecek dan mengembalikan pesan error di <span class="error"> (atau kosong jika valid).

💡 Pattern ini ringan: cukup endpoint cepat di server yang return HTML error message atau string kosong. Tidak perlu WebSocket atau JavaScript tambahan.