Tutorial Form HTML Part 9: Fungsi dan Cara Penggunaan Tag Input Type Hidden HTML

Tag input dengan type hidden merupakan salah satu “senjata rahasia” dalam merancang form HTML. Di dalam Tutorial Form HTML: Fungsi dan Cara Penggunaan Tag Input Type Hidden ini kita akan mempelajari cara memanfaatkan fitur objek ini.

Fungsi tag input type hidden dalam pembuatan Form HTML

Tag input dengan type hidden adalah sebuah objek form khusus yang sesuai dengan nama tipenya, memang tersembunyi dan tidak dapat dilihat oleh user. Namun objek form ini menawarkan fleksibilitas yang dapat dimanfaatkan oleh programmer untuk menyisipkan suatu data untuk diproses.
Type hidden ini bisa digunakan untuk mengirim suatu data dari sebuah halaman ke halaman lain tanpa mengganggu bentuk form yang telah ada, dan biasanya digabungkan dengan pemrosesan javascript atau PHP.

Cara penulisan dasar type hidden ini adalah sebagai berikut:

<form>
   <input type="hidden" />
</form>

Atribut name: Untuk Pemrosesan tag input type hidden

Atribut name berfungsi sebagai penanda nama untuk memproses hasil pilihan form ke dalam web server (misalnya dengan bahasa PHP). Berikut adalah cara penulisan tag input type hidden dengan atribut name:

<form>
   <input type="hidden" name="asal_halaman" />
</form>

Atribut value: Sebagai Nilai tag input type hidden

Atribut value untuk type hidden berguna pada saat pemrosesan form oleh web server. Misalnya dalam bahasa  PHP, nilai dari value inilah yang akan diproses. Dalam type hidden ini, nilai dari atribut value inilah yang merupakan nilai terpenting, karena disinilah programmer dapat menyisipkan data yang diinginkan.

Berikut adalah contoh penggunaan atribut value:



<form>
   <input type="hidden" name="asal_halaman" value="halaman_register" />
</form>

Atribut id dan class: CSS dan Javascript

Selain atribut yang dijelaskan diatas, kita juga bisa menggunakan atribut umum seperti id dan class dalam tag input type hidden. Namun karena sifatnya yang tersembunyi, atribut class tidak akan diperlukan. Tag id dibutuhkan untuk pemograman HTML menggunakan Javascript.

Cara Penggunaan tag input type hidden dalam Form HTML

Untuk merangkum penggunaan Tag Input type hidden beserta atributnya, saya akan membuat contoh kode HTML cara penggunaan tag input type hidden:

 Jika anda menjalankan kode HTML tersebut, yang terlihat hanya sebuah tombol, namun ketika tombol tersebut diklik, objek form hidden akan terlihat nilainya di alamat web browser sebagai berikut:
file:///D:/BelajarHTML/proses.php?asal_halaman=halaman_register

Pesan ini menandakan bahwa sebenarnya di dalam form terdapat tag input dengan type hidden. Asal_alaman berasal dari atribut name, dan halaman_register adalah nilai dari atribut value. Penggunaan tag input type hidden ini akan berguna saat dikombinasikan dengan bahasa pemograman web seperti Javascript.

Dalam tutorial tag input type hidden ini kita telah mempelajari cara penulisan dan penggunaan objek form hidden. Berikutnya kita akan membahas tentang tag select.