Cara Mudah Membuat Form dan Tipe-Tipenya di HTML
Form dalam HTML
Saat kita ingin mendaftar didalam suatu contoh Sosial Media pasti kita akan diperlihatkan dengan sebuah form-form yang harus kita isi. Sebagai masukkan atau inputan kedalam dokumen dari pengguna. Inputan data tersebut akan dapat diproses lebih lanjut menjadi informasi yang dibutuhkan oleh pengguna maupun pemilik situs tersebut.
Untuk media input/masukan tersebut ada beberapa jenis diantaranya berupa Text, Radio Button, CheckBox, DrodownList dan Submit. Nah, disini kita hanya akan membahas cara membuat form-form tersebut berupa text dengan tipe-tipe form text nya.
Cara Penulisan Form dalam HTML adalah :
<form action="URL" method="get/post">Isi Form</form>
- form action adalah alamat atau bisa juga yang digunakan adalah file untuk memproses input dari form kedalam server.
- method yaitu cara yang digunakan untuk menyimpan data ke server, bisa diisi dengan get atau pun post. Jika kita isi dengan get maka data form yang diisi akan tampil pada URL Web browser. Sedangkan jika kita mengisi dengan post, maka data hasil form tidak akan tampil di Web browser.
Form dalam bentuk text di HTML dapat dilakukan dengan menggunakan 2 buah elemen yaitu sebagai berikut :
- Textarea
Textarea digunakan jika kita ingin memasukan teks lebih dari satu baris. Dan untuk penggunaannya pun sangat mudah kita hanya memberikan tag <textarea> dan </textarea> untuk penutup tag nya.Contoh :
- Textarea dengan isi kosong.
<textarea></textarea>
Hasil :
- Textarea dengan berisi.
<textarea>Contoh isi textarea</textarea>
Hasil :
- Textarea dengan ukuran tertentu.
<textarea cols="5" rows="5"></textarea>
Hasil :
- Input
Input digunakan untuk masukan teks yang terdiri dari satu baris saja. Input ini sering kali digunakan jika pengguna hanya mengisi data dengan singkat. Tag yang digunakan adalah <input type="atribut">. Untuk atribut, kita ganti dengan tipe-tipe data berikut sesuai dengan fungsinya masing-masing. - color Input berupa warna
- date Input berupa tanggal
- datetime-local Input berupa tanggal lokal
- datatime Input berupa waktu & tanggal
- email Input berupa email
- file Input berupa file
- month Input berupa bulan
- number Input berupa nomor
- password Input berupa sandi
- range Input berupa range
- search Input berupa pencarian
- tel Input berupa nomor telepon
- text Input berupa Teks
- time Input berupa waktu
- url Input berupa alamat URL
- week Input berupa mingguan
Tipe Fungsi Contoh
Untuk fungsi atribut lainnya seperti value/nilai, size/ukuran, maxlength/maksimal panjang karakter dan lain-lain, dapat ditambahkan kedalam tipe-tipe input berupa alfabet. Sedangkan pada tipe-tipe input nomor seperti time, date dan lainnya kita juga bisa menambahkan fungsi atribut seperti min dan max, value/nilai serta lainnya.
Contoh : <input type="text" value="Masukkan Teks" size="10" maxlength="7">
Hasil :
<input type="date" min="2018-11-01" max="2018-11-15" value="2018-11-09">
- Hasil :
Demikian postingan saya kali ini, semoga berguna dan bermanfaat bagi kita semua. Kekurangan dan kesalahan saya mohon maaf, dan jika belum paham atau ingin bertanya berikanlah komentar dibawah. Atas kunjungannya saya ucapkan Terima Kasih
Comments