Input Attribute dalam Membuat Form - Dalam membuat form dengan HTML ada beberapa struktur yang perlu diperhatikan. Selain jenis input type apa yang akan dipakai, juga input attribute apa yang akan digunakan sebagai perintah ketika mengirimkan data ke server. Jika sebelumnya beberapa jenis input type sudah kita bahas, selanjutnya sekarang sinahu coding akan mengajak konco sinahu untuk mencermati jenis input attribute apa saja yang ada dalam membuat form ini.
Beberapa input attribute mungkin sudah familiar dan sering kita jumpai. Hanya mungkin kita belum tahu istilahnya apa dan bagaimana cara membuatnya. Barangkali ada yang masih bingung apa itu attribute, apa itu elemen, dan istilah-istilah lain dalam pembelajaran HTML ini. Karena mungkin baru sempat mampir ke sini, konco sinahu bisa merujuk kembali tentang attribute dan elemen dalam HTML.
Attribute value ini fungsinya untuk menampilkan atau memunculkan kata apa yang kita inginkan untuk terlihat di bidang input. Kalau ingin bidang input nya kosong juga bisa, tinggal menghilangkan attribut value nya. Contoh penerapan fungsi attribute value seperti di bawah ini :
hasilnya :
Keterangan :
Karena pada bidang input Nama Depan kita cantumkan value="Jono", maka sebagaimana terlihat kata Jono langsung otomatis muncul pada bidang input.
Sama seperti namanya, readonly (hanya untuk dibaca), maka fungsi attribute ini adalah untuk menampilkan kata pada bidang input, akan tetapi kata pada bidang input tersebut tidak bisa diubah dengan kata lain. Berbeda dengan attribute value tadi, kata yang ditampilkan masih bisa diedit. Seperti ini contohnya :
hasilnya :
Hampir sama dengan attribute readonly, hanya saja untuk attribute disable ini lebih menegaskan bahwa bidang input tidak bisa diedit. Tampilannya akan ada fill color abu-abu pada bidang input.
hasilnya :
Size, ukuran. Yang dimaksud di sini bukan ukuran besar kecilnya tulisan, tapi ukuran panjang bidang input yang diinginkan. Semakin besar angkanya maka bidang inputnya akan semakin memanjang. Misalnya di bawah ini saya atur size nya sebesar 30.
hasilnya :
Kalau attribute size tadi untuk mengatur ukuran panjang pendeknya bidang input. Nah, kalau maxlength ini untuk men-set batasan jumlah karakter huruf yang bisa diketikkan pada bidang input. Misal di bawah ini saya atur maxlength sebesar 12. Artinya, jumlah huruf yang bisa diketikkan pada bidang input hanya dibatasi sampai 12 karakter.
hasilnya :
Mudah ya. Itu saja dulu. Kita sambung lain kali. Semoga bisa dipahami dan jangan lupa kesediaannya untuk meninggalkan jejak ya. hehe..
Beberapa input attribute mungkin sudah familiar dan sering kita jumpai. Hanya mungkin kita belum tahu istilahnya apa dan bagaimana cara membuatnya. Barangkali ada yang masih bingung apa itu attribute, apa itu elemen, dan istilah-istilah lain dalam pembelajaran HTML ini. Karena mungkin baru sempat mampir ke sini, konco sinahu bisa merujuk kembali tentang attribute dan elemen dalam HTML.
Jenis Input Attribute dalam Membuat Form
Value
Attribute value ini fungsinya untuk menampilkan atau memunculkan kata apa yang kita inginkan untuk terlihat di bidang input. Kalau ingin bidang input nya kosong juga bisa, tinggal menghilangkan attribut value nya. Contoh penerapan fungsi attribute value seperti di bawah ini :
<form action="">
Nama Depan:<br>
<input type="text" name="firstname" value="Jono">
<br>
Nama Belakang:<br>
<input type="text" name="lastname" value="Joni">
</form>
hasilnya :
Keterangan :
Karena pada bidang input Nama Depan kita cantumkan value="Jono", maka sebagaimana terlihat kata Jono langsung otomatis muncul pada bidang input.
Readonly
Sama seperti namanya, readonly (hanya untuk dibaca), maka fungsi attribute ini adalah untuk menampilkan kata pada bidang input, akan tetapi kata pada bidang input tersebut tidak bisa diubah dengan kata lain. Berbeda dengan attribute value tadi, kata yang ditampilkan masih bisa diedit. Seperti ini contohnya :
<form action="">
Nama Depan:<br>
<input type="text" name="firstname" value ="Jono" readonly>
<br>
Nama Belakang:<br>
<input type="text" name="lastname">
</form>
hasilnya :
Disabled
Hampir sama dengan attribute readonly, hanya saja untuk attribute disable ini lebih menegaskan bahwa bidang input tidak bisa diedit. Tampilannya akan ada fill color abu-abu pada bidang input.
<form action="">
Nama Depan:<br>
<input type="text" name="firstname" value ="Jono" disabled>
<br>
Nama Belakang:<br>
<input type="text" name="lastname">
</form>
hasilnya :
Size
Size, ukuran. Yang dimaksud di sini bukan ukuran besar kecilnya tulisan, tapi ukuran panjang bidang input yang diinginkan. Semakin besar angkanya maka bidang inputnya akan semakin memanjang. Misalnya di bawah ini saya atur size nya sebesar 30.
<form action="">
Nama Depan:<br>
<input type="text" name="firstname" value ="Jono" size="30">
<br>
Nama Belakang:<br>
<input type="text" name="lastname">
</form>
hasilnya :
Maxlength
Kalau attribute size tadi untuk mengatur ukuran panjang pendeknya bidang input. Nah, kalau maxlength ini untuk men-set batasan jumlah karakter huruf yang bisa diketikkan pada bidang input. Misal di bawah ini saya atur maxlength sebesar 12. Artinya, jumlah huruf yang bisa diketikkan pada bidang input hanya dibatasi sampai 12 karakter.
<form action="">
Nama Depan:<br>
<input type="text" name="firstname" maxlength="12">
<br>
Nama Belakang:<br>
<input type="text" name="lastname">
</form>
hasilnya :
Mudah ya. Itu saja dulu. Kita sambung lain kali. Semoga bisa dipahami dan jangan lupa kesediaannya untuk meninggalkan jejak ya. hehe..
0 Komentar untuk "Input Attribute dalam Membuat Form (Bag 1)"