Cara merapikan form di html

Anda tentunya sudah tidak asing dengan istilah “form”. Form adalah sebuah daftar isi yang merupakan salah satu penampilan interaktif yang paling popular di internet. Form atau daftar isian ini digunakan untuk meminta informasi dari user yang kemudian akan diolah. Secara umum, pengolahan form dilakukan dengan menggunakan script yang bersifat server – side.

Untuk beberapa keperluan tertentu, Anda tentunya membutuhkan penggunaan form di website yang Anda miliki misalnya form untuk survei, form biodata, form pendaftaran, form login, dan yang lainnya. Form memungkinkan pengguna berinteraksi dengan teks, grafik, atau yang lainnya yang ditampilkan pada browser. Pada pembahasan kali ini, saya akan menjelaskan tentang cara membuat form di HTML. Untuk lebih jelasnya, mari simak penjelasan dibawah ini :

Tag Form

Tag

adalah tag yang digunakan untuk mendefinisikan sebuah form. Jadi, sebuah form dibentuk oleh pasangan tag …..
. Pada tag
terdapat dua atribut yaitu atribut method dan action yang mempunyai fungsi sebagai berikut:

AtributFungsiMethodDigunakan untuk menentukan cara mengirimkan data yang dimasukkan user ke web server (metode pengolahan form). Dimana terdapat dua metode yaitu GET dan POST. Metode POST mengirimkan seluruh data dari form yang terpisah dari URL. Sedangkan, metode GET mengirimkan data pada server dengan meletakkannya pada bagian akhir URL.ActionDigunakan untuk menentukan lokasi atau URL dari file yang akan digunakan untuk mengolah form tersebut.

Berikut contoh dari penggunaan tag :


 …………………………………
 

Tag Input

Tag adalah tag yang digunakan untuk membuat elemen – elemen yang digunakan untuk meminta informasi dari user atau membuat kontrol kotak teks misalnya checkbox, textbox, button, radio button, dan yang lainnya. Penggunaan tag ini juga tidak memerlukan tag penutup. Selanjutnya, tag memiliki beberapa atribut umum sebagai berikut:

AtributFungsinameMendefinisikan nama pada elemen input. Atribut ini harus Anda tulis pada semua elemen kecuali elemen tipe clear dan submit.maxlengthMenentukan jumlah karakter maksimal yang dapat dimasukkan pada suatu elemen input.valueMenyatakan nilai default pada suatu elemen input. Untuk textbox, menentukan teks yang tertulis. Untuk checkbox atau radio, menentukan nilai item yang dipilih yang akan dikirim ke server. Sedangkan, untuk button submit dan reset, atribut ini digunakan menentukan teks yang ditulis pada button.sizeMenentukan lebar dari elemen input dalam pixel dimana ukuran defaultnya adalah 20 pixel.checkedHanya digunakan pada tipe checkbox dan radio untuk menyatakan suatu item dipilih atau tidak (Penjelasan mengenai atribut checked akan dibahas pada materi berikutnya).typeMenentukan tipe input yang akan digunakan seperti text, radio dan yang lainnya.

Tentu masih ada atribut lain yang belum disebutkan diatas, karena yang diatas hanya atribut yang paling umum saja. Untuk kedepannya saya akan menjelaskan atribut-atribut yang saya maksud tersebut.

Atribut type=”text”

Secara umum, terdapat beberapa tipe yang ada pada atribut type tetapi pada materi ini yang akan dibahas adalah mengenai atribut type dengan nilai atau tipe text sedangkan untuk tipe yang lainnya akan dijelaskan pada tutorial yang selanjutnya. Tipe text digunakan untuk membuat kotak teks yang memungkinkan user memasukkan data dalam bentuk teks.

Berikut contoh kode penulisan dan penggunaan tag di HTML :



 
  Penggunaan Form di HTML
 
 
  

Isilah formulir dibawah ini dengan baik dan benar !


NIM :

Alamat Rumah :

Email :

No.Telepon :

Setelah kode diatas dijalankan pada browser maka akan tampil seperti gambar dibawah ini :

Cara merapikan form di html
Cara merapikan form di html

Dari gambar diatas, Anda dapat melihat perbedaan penggunaan atribut size pada masing – masing textbox, ada yang berukuran 11px, 40px dan tidak ditetapkan sizenya sehingga memiliki lebar dengan nilai default 20px. Dan juga pada textbox “NIM” ditetapkan atribut maxlength yang bernilai 9, sedangkan pada textbox lainnya tidak ditetapkan sehingga bernilai tak terhingga.

Selanjutnya, daftar isian tersebut tidak hanya terdiri dari kotak teks (textbox) tetapi juga tombol submit dan reset. Untuk pembahasan mengenai tombol submit dan reset akan dijelaskan pada materi berikutnya. Sekian materi cara membuat form sederhana di HTML, semoga Anda dapat memahami materi ini dengan baik.

Part 26: Atribut Align dan Valign pada Tabel

Part 28: Elemen Input Type Password dan Submit

Editor: Muchammad Zakaria

Download berbagai jenis aplikasi terbaru, mulai dari aplikasi windows, android, driver dan sistem operasi secara gratis hanya di Nesabamedia.com:

Apa itu tag form HTML?

HTML element tag
merupakan tag pada HTML yang digunakan untuk menciptakan formulir bagi isian input dari pengguna.

Apa fungsi form action pada HTML?

Atribut action berfungsi untuk menentukan URL tujuan di mana data dari suatu akan dikirimkan lalu diolah ketika ia disubmit. Jadi ketika suatu form disubmit, browser akan mengirimkan seluruh data yang ada pada form tersebut menuju URL yang didefinisikan dalam atribut action .

Form HTML apa saja?

Form merupakan bagian pada HTML yang dapat digunakan untuk membuat elemen Form pada halaman Web. Elemen Form dapat terdiri dari check box, radio button, menu, text box, text area, dan button.

Langkah langkah membuat form login HTML?

Cara Membuat Form Login yang Menarik dengan HTML.
Deklarasikan Dokumen HTML Anda. Sekarang, buka file html form login Anda. ... .
2. Buat Kepala Halaman Form Login. ... .
3. Beri Judul Halaman Form Login. ... .
3. Sisipkan File CSS. ... .
4. Buat Badan Form Login. ... .
Buat Layout Form Login. ... .
6. Beri Judul Form Login. ... .
7. Buat Kotak Form Login..