Haloo, kembali lagi ya di sesi web yang ke 8 ini , jadi disini saya mau
ngeshare gimana cara menyajikan macem macem textarea , mulai dari textarea
hidden ,textarea password dll. Disini saya akan share sebagian kodingannya saja
tidak semua jika anda ingin melihat kodingannya anda bisa melihatnya Disini
Text area hampir mirip dengan text box. Perbedaannya adalah text area lebih dapat banyak menampung sebuah text lebih dari satu baris dari pada text box tag yang digunakan dalam membuat text area adalah
<textarea name="alamat" rows="5"
cols="40"></textarea>
Anda bisa mengubah ukuran sesuai dengan keinginan anda (rows dan
cols).
<textarea> tag yang digunakan untuk membuat tag area
<input> adalah tag yang digunakan untuk menginput data contohnya
adalah <input type = "textarea>
Form merupakan salah satu elemen dalam HTML yang digunakan untuk menerima
input dari pengunjung. Melalui form pengunjung sebuah halaman web dapat
melakukan interaksi dengan web. Pengunjung dapat memasukan data melalui
elemen-elemen input seperti textfield, checkbox, radio button, textarea, submit
button, dropdown dan lain-lain. Selain itu pengunjung juga dapat
melakukan pemilihan data mengunakan elemen select list atau dengan istilah lain
combo box atau drop-down list. Form membuat sebuah halaman web menjadi web
interaktif dan dinamis, karena form merupakan satu-satunya sarana bagi
pengembang website untuk mendapatkan informasi dari pengguna.
<form>
Input elements
</form>
Ada dua atribut
yang digunakan pada elemen form yaitu method dan action.
Method yang
berfungsi sebagai pengiriman data pada server dengan cara ke tujuan yaitu :
- Get: mengirim
data pada server dengan cara meletakan data pada bagian akhir URL yang
ditunjuk.
- Post : mengirim
datanya secara terpisah.
Perbedaannya, jika
kita mengisi atribut method dengan get (dimana ini adalah nilai default
seandainya kita tidak menuliskannya) maka isian form akan terlihat pada url
browser. Method get ini biasanya digunakan untuk query pencarian. Method post
biasanya digunakan untuk data yang lebih sensitif seperti yang berisi password,
atau registrasi user. Data hasil form tidak akan terlihat pada browser.
Action yang
berfungsi menentukan lokasi dari script yang akan memproses data dari form.
Struktur dasar form
akan terlihat sebagai berikut:
<form action="logindata.php" method="post">
...isi form...
</form>
Elemen Input pada form
Elemen yang paling penting dalam form adalah elemen input. Elemen ini
memungkinkan pengunjung memasukan data melalui halaman form yang datanya
kemudian akan dikirimkan keserver. Ada banyak elemen-elemen input pada form,
yang dapat digunakan oleh pengguna untuk mengisikan data dengan yang
berbeda-beda jenisnya. Berikut ini saya akan membahas tiap-tiap elemen input
form, beserta dengan cara pembuatannya.
1. Text Field
Elemen yang digunakan untuk memasukan text dalam satu baris. Lebar
karakter defaultnya adalah 20 karakter.
Penulisan :< input type=”text” />
2. Password Field
Untuk memasukan datu baris teks dengan format chiphertext/password.
Dengan karakter yang disamarkan dengan bulatan atau tanda “*”.
Penulisan :< input type=”password” />
3. Radio Button
Radio button digunakan agar dapat memilih salah satu pilihan. Contoh
jenis kelamin (male or female).
Penulisannya : Radio Button<input type="radio">
4. Text Area
Digunakan sebagai input kontrol form untuk memasukan teks lebih dari
satu baris. Elemen ini mempunyai atribut yaitu name, cols, dan rows.
Seperti dijelaskan berikut :
Nama
= nama dari veriabel yang dikirim ke suatu aplikasi
Rows
= panjang baris dalam karakter
Cols
= tinggi kotak
Name=”name”
Cols=”number”
Row=”number”
...........
</text area>
berikut merupakan contoh text area yang tidak dapat disalin dan dapat
disalin
5. Check Box
Check Box digunakan untuk dapat memilih lebih dari satu pilihan.
Penulisannya: Check Box<input type="checkbox">
6. Select List
Digunakan untuk menampilkan daftar pilihan dalam bentuk drop-down list.
Penulisannya :
<select>
......
</select>
7. Submit Button
Digunakan untuk mengirimkan data dari halaman web ke server. Setiap
elemen form membutuhkan tombol submit untuk mengirimkan nama dan nilinya ke
suatu aplikasi yang di tentukan dalam atribut ACTION dlam elemen FORM.
Penulisannya : Submit<input type="submit">
Berikut adalah kombinasi dari beberapa bagian
ini merupakan login form sederhana dengan menggunakan input type text
area dll.
sedangkan ini adalah login form lainnya yang saya buat menggunakan
html&CSS dan Javascript,
penggunaan javascript disini yaitu ketika user menklik Submit Button maka akan muncul pop up seperti ini
penggunaan javascript disini yaitu ketika user menklik Submit Button maka akan muncul pop up seperti ini
Berikut merupakan sedikit cuplikan kodingannya
Sekian saja dari sesi kali ini , mohon maaf apabila ada kesalaahan
sampai jumpa di sesi berikutnya
0 komentar:
Posting Komentar