Tuesday, July 8, 2014

Belajar HTML Form dan Input



Form biasanya digunakan untuk mengumpulkan data dari pengunjung web kita. Mulai dari form untuk login, form kontak, form untuk pendaftaran user, bahkan untuk mengirimkan data antar halaman web. Pada tutorial belajar HTML: cara membuat form di HTML ini kita akan membahas cara penggunakan tag form di dalam HTML.
 HTML Form dapat mengandung beberapa elemen seperti tempatnya text, check box, tombol radio, tombol submit,dll. Form dapat juga mengandung select, text area, fieldset, legend, dan elemen tabel.
Dari pada kelamaan, yuk kita mulai ..:

Tag <form> digunakan untuk membuat form html.

<form>
.
masukan elemen disini
.
</form>

HTML Form - Input Elemen

Elemen yang paling penting dari form adalah elemen <input>.
Elemen <input> digunakan untuk memilih informasi.
Btw, beberapa elemen input akan di tunjukan di bawah :

Text Fields

<input type="text">  <- Cuma 1 line text yang bisa di isi oleh user.
NB: . Default text yang bisa di isi adalah 20 karakter.
Contoh :
<form>
Nama: <input type="text" name="nama"><br>
Email: <input type="text" name="email">
</form>
 Penampakannya :

Nama:
Email:


Password Field

<input type="password"> <- biasanya digunakan pada saat login/daftar. Kan ada tuh di suruh isi password. Tapi yang muncul biasanya bintang/bulat hitam. Seperti inilah kodenya dan penampakannya :

<form>
Password: <input type="password" name="pwd">
</form>

Password:


Radio Button

<input type="radio"> <-- gtw dah np di beri nama radio button. Tapi yang pasti dengan radio button user dapat hanya memilih 1 pilihan. Bingung?, nih ane kasi penampakannya :

<form>
<input type="radio" name="LGC" value="male">Yes<br>
<input type="radio" name="LGC" value="female">No
</form>

Penampakan :
Yes
No

Check Box

<input type="checkbox"> <-  Dengan ini , user dapat memilih banyak sekali bahkan unlimited.

<form>
<input type="checkbox" name="motor" value="Ninja">I have a bike<br>
<input type="checkbox" name="motor" value="Mio">I have a car
</form>
Penampakan:
I have a bike
I have a car

Submit Button

<input type="submit">Ini nih gan yang penting. Digunakan untuk mengirim form data ke server. Data dikirim ke data yang telah di isi di atribut action. Cth action = mantap.php . Ntar data form di kirim ke mantap.php gituuuh...
Contohnya dan penampakannya seperti ini :
<form name="input" action="proseskirim.php" method="post">
Username: <input type="text" name="nama">
<input type="submit" value="Submit">
</form>
Penampakannya :
Username:



Mungkin sekian dulu ya gan..ntar ane tambah lagi ...:D

Sebagian sumber : w3school.

No comments:

Post a Comment

Menjadi Donatur untuk blog ini hanya dengan 1 klik iklan.