Fungsi Tag Button pada HTML

Apa Fungsi Tag Button pada HTML ?. Button adalah tombol yang digunakan untuk memproses data yang telah di input user ke dalam textfield.

Button ini terdapat 2 fungsi yakni, Submit untuk memproses data inputan, dan Reset untuk membatalkan.

Penggunaan Button ini di selaraskan dengan skrip php / javascript. Skrip – skrip ini berisi perintah pemroses, seperti data akan di ambil nilai lebih dulu kemudian di tampilkan ke halaman atau di proses lebih dulu dengan data lain baru ditampilkan ke halaman.

Tag Button ini mempunyai 3 atribut dasar, yakni :

Atribut Kegunaan
Name Mendefinisikan nama Button, hal ini diperlukan untuk pemrosesan data.
Type Memilih tipe Button yang diinginkan (submit / reset / button).
Value Mendefinisikan nilai Button tersebut.

Dari kolom type pada table di atas, terdapat 3 nilai atribut seperti :

  1. Submit, digunakan untuk memproses data yang di input. Gunakan nilai atribut button ini bila anda hendak memproses data.
  2. Reset, digunakan untuk mengosongkan nilai pada form inputan. Akan lebih baik bila nilai atribut ini juga dimasukan dalam form, sebagai opsi bagi user apabila terjadi salah inputan. Apabila data yang di input yang salah hanya 1, mungkin tidaklah masalah bila nilai atribut ini tidak dimasukan. Namun apabila user banyak melakukan kesalahan dalam menginput data, tentu tombol ini akan sangat berguna, agar user tidak menghapus data inputan satu per satu.
  3. Button, nilai atribut button biasa dikombinasikan dengan Javascript. Seperti mengeluarkan alert / merubah warna elemen apabila tombol button di tekan.

Di bawah ini adalah contoh kode sumbernya, namun pada kode sumber di bawah ini sengaja tidak saya kombinasikan dengan PHP agar materi ini tetap fokus pada materi HTML lebih dulu :

Dan di bawah ini adalah hasil dari kode sumber di atas :

fungsi tag button pada html

Sekarang silahkan masukan sembarang teks pada textfield, bila saya akan saya tuliskan “coba” pada textfield. Lalu saya tekan tombol kirim. Maka akan muncul alert

tag button pada html

Kemudian bila saya klik ok pada alert tersebut akan terjadi perubahan pada URL. Hal ini terjadi karena skrip type=”submit” pada :

Yang berarti data inputan pada textfield akan terproses.

apa itu tag button

Sementara tombol Reset digunakan untuk mengosongkan teks input apabila terjadi kesalahan input.

Leave a comment

Your email address will not be published. Required fields are marked *

× Contact Us