Cara Pemakaian dan Fungsi Tag Input Type Hidden HTML

belajar HTML dan CSS untuk pemula

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

Fungsi tag input type hidden dalam pembuatan Form HTML

Tag input dengan type hidden ialah sebuah objek form khusus yang cocok dengan nama tipenya, memang tersembunyi dan tidak bisa dilihat oleh user. Tetapi objek form ini menawarkan fleksibilitas yang bisa dimanfaatkan oleh programmer untuk menyisipkan suatu data untuk diproses.

Type hidden ini dapat dipakai untuk mengirim suatu data dari sebuah halaman ke halaman lain tanpa mengganggu bentuk form yang sudah ada, dan pada umumnya digabungkan dengan pemrosesan javascript atau PHP.

Cara penulisan dasar type hidden ini yaitu sebagai berikut:

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

Atribut name

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

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

Atribut value:

Atribut value untuk type hidden berguna di saat pemrosesan form oleh web server. Contohnya dalam bahasa  PHP, nilai dari value inilah yang akan diproses. Dalam type hidden ini, nilai dari atribut value inilah yang menjadi nilai paling penting, sebab disinilah programmer bisa menyisipkan data yang diharapkan.

Berikut ialah contoh pemakaian atribut value:

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

Atribut id dan class: CSS dan Javascript

Selain atribut yang dipaparkan diatas, kita juga dapat memakai atribut umum seperti id dan class dalam tag input type hidden. Tetapi sebab sifatnya yang tersembunyi, atribut class tak akan dibutuhkan. Tag id diperlukan untuk pemograman HTML memakai Javascript.

Cara Pemakaian tag input type hidden dalam Form HTML

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

<!DOCTYPE html>
<html>
<head>
<title>Belajar Tag Input Type=hidden HTML</title>
</head>
<body>
<h4>Belajar tag Input type="hidden" di infanthree.com:</h4>
<form action="proses.php" method="get">
<input type="hidden" name="asal_halaman" value="halaman_register"/>
<input type="submit" value="Kirim pesan rahasia"/>
</form>
</body>
</html>

Bila kamu menjalankan kode HTML itu, yang tampak cuma sebuah tombol, tetapi saat tombol itu diklik, objek form hidden akan tampak nilainya di alamat web browser sebagai berikut:

file:///D:/BelajarHTML/proses.php?asal_halaman=halaman_register

Pesan ini tandanya bahwa sebetulnya di dalam form terdapat tag input dengan type hidden. Asal_alaman asalnya dari atribut name, dan halaman_register ialah nilai dari atribut value. Pemakaian tag input type hidden ini akan berguna waktu dikombinasikan dengan bahasa pemograman web seperti Javascript.

Dalam tutorial tag input type hidden ini kita sudah mempelajari cara penulisan dan pemakaian objek form hidden. Selanjutnya kita akan membicarakan mengenai tag select.


Butuh Web Developer Makassar atau Jasa SEO di Makassar yang bergaransi? Jangan ragu dengan infanthree.com. Kami juga penyedia Jasa Pembuatan Aplikasi Android di Makassar yang terkemuka. Selain itu ada layanan SEM, SMM, Internet Marketing Agency Makassar dan Social Media, Pembuatan Logo, Konten, Video, Maskot dan Instalasi jaringan ataupun mikrotik, hingga pelatihan komputer dan internet marketing.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *