Menggunakan Input Tersembunyi dengan Spring dan Thymeleaf

1. Pengenalan

Thymeleaf adalah salah satu mesin templat yang paling popular di ekosistem Java. Ini membolehkan kita dengan mudah menggunakan data dari aplikasi Java kita untuk membuat halaman HTML yang dinamis.

Dalam tutorial ini, kita akan melihat beberapa cara untuk menggunakan input tersembunyi dengan Spring dan Thymeleaf.

2. Thymeleaf dengan Bentuk HTML

Sebelum kita melihat bekerja dengan bidang tersembunyi, mari kita mundur dan melihat bagaimana Thymeleaf berfungsi dengan bentuk HTML secara umum.

Kes penggunaan yang paling biasa adalah menggunakan borang HTML yang memetakan terus ke DTO dalam aplikasi kami .

Sebagai contoh, anggap kita menulis aplikasi blog dan mempunyai DTO yang mewakili satu catatan blog:

class BlogDTO { long id; String title; String body; String category; String author; Date publishedDate; }

Kita dapat menggunakan bentuk HTML untuk membuat contoh baru DTO ini menggunakan Thymeleaf dan Java:

Perhatikan bahawa medan dalam peta DTO blog-posting kami ke satu input dalam bentuk HTML. Ini berfungsi dengan baik dalam kebanyakan kes, tetapi bidang apa yang tidak boleh diedit? Di sinilah input tersembunyi dapat membantu.

Contohnya, setiap catatan blog mempunyai medan ID unik yang tidak boleh disunting oleh pengguna. Dengan menggunakan input tersembunyi, kita dapat memasukkan bidang ID ke dalam bentuk HTML tanpa membiarkannya ditampilkan atau diedit .

3. Menggunakan atribut th: field

Cara terpantas untuk menetapkan nilai pada input tersembunyi adalah dengan menggunakan atribut th: field :

Ini adalah cara paling mudah kerana kita tidak perlu menentukan atribut nilai, tetapi mungkin tidak disokong dalam versi Thymeleaf yang lebih lama .

4. Menggunakan atribut th: attr

Cara seterusnya untuk menggunakan input tersembunyi dengan Thymeleaf adalah menggunakan atribut th: attr bawaan :

Dalam kes ini, kita harus merujuk bidang id menggunakan objek blog .

5. Menggunakan nama Atribut

Pendekatan lain yang kurang jelas adalah menggunakan atribut nama HTML standard :

Ia hanya bergantung pada atribut HTML standard. Dalam kes ini, kita juga mesti merujuk bidang id menggunakan objek blog .

6. Kesimpulannya

Dalam tutorial ini, kami melihat beberapa cara untuk menggunakan input tersembunyi dengan Thymeleaf. Ini adalah teknik yang berguna untuk meneruskan bidang baca sahaja dari DTO kami ke dalam bentuk HTML.

Seperti biasa, semua contoh kod yang digunakan dalam tutorial ini boleh didapati di Github.