Blog sharing cara membuat blog, website, toko online, desain web, dan template

Saturday, November 1, 2014

Cara Membuat Form di blog

Form merupakan salah satu elemen didalam HTML. Elemen ini diguanakna untuk mendapatkan masukan dari pengguna web. Dengan menggunakan form ini pengguna atau audience dapat melakukan input melalui halaman HTML. Pada umumnya pengolahan form digunakan pada server dengan menggunakan skrip PHP, ASP dan lainnya. Untuk membuat tag form, maka diperlukan tag pembuka <form> dan tag penutup </form>.

Nah cara penulisannya adalah sebagai berikut:
<form action=”#” method=”get”/”post”>
input elements
</form>
Dalam penulisan form ada beberapa atribut yang bisa digunakan salah satunya adalah action dan method. Berikut ini adalah atribut yang bisa digunakan dalam membuat form:
  • Action : Untuk menentukan lokasi dari script yang akan memproses data form. Action ditulis dalam bentuk URL.
  • Method : Mengirim data ke tujuan, method memiliki 2 cara :
    Get : mengirimkan data pada server dengan melekakkan nama data pada bagian URL.
    Post : mengirimkan data secara terpisah, jadi keterangan data yang di inputkan tidak akan terlihat dalam URLnya.
Sedangkan dalam pengaturan form ada lagi kode untuk mengatur jenis masukan dalam form. Jenis tampilan ini antara lain :
  • Text : digunakan untuk mengisi suatu nilai berupa teks ataupun angka didalam form
  • Radio : digunakan untuk menginput berupa pilihan yang hanya bisa menginputkan satu pilihan saja
  • Checkbox : digunakan untuk menginputkan pilihan yang bisa dipilih lebih dari satu
  • List : elemen pilihan dalam bentuk daftar
  • Button : elemen berupa tombol untuk melakukan suatu proses
  • Submit : elemen yang digunakan untuk memanggil URL atau mengirimkan data
  • Reset : elemen yang digunakan untuk mengembalikan data awal atau menghapus data yang belum dikirimkan.
  • Image : digunakan untuk sebagai pengganti button, berupa gambar yang dapat melakukan proses
  • Textarea : elemen yang dapat menampung kumpulan teks atau kalimat dari inputan user. Textarea bersifat fleksibel karena user bisa mengatur kelebaran dan ketinggian area kalimat.
  • File : digunakan untuk memanggil file atau gambar yang disimpan dalam storage
  • Password : digunakan untuk mengisi password, dengan menggunakan elemen ini kata yag user inputkan dalam form tidak akan terlihat atau disamarkan menjadi kode tertentu
Nah, setelah kita tahu elemen yang bisa kita gunakan untuk menentukan jenis tampilan form, berikut ini adalah cara penulisan kode dan elemen formnya :

<form method="get">
Nama <input type="text" name="nama"/><br/>
Password <input type="password" name="pwd"/><br/>
Hobby
<input type="checkbox" name="Hobby" value="Camping">Camping
<input type="checkbox" name="Hobby" value="Travelling">Travelling
<input type="checkbox" name="Hobby" value="Caving">Caving</br>
Jenis Kelamin
<input type="radio" name="JK" value="Pria">Pria
<input type="radio" name="JK" value="Wanita">Wanita</br>
Alamat
<textarea name="Alamat" width="120px" height="60px"></textarea></br>
Kategori
<select name="kategori">
<option>Pilih Kategori</option>
<option value="Pribadi">Pribadi
<option value="Umum">Umum
</select></br>
Pilih File
<input type="file" name="pf"></br>
</br>
<input type="submit" name="submit" value="Kirim">
<input type="reset" name="reset" value="Hapus">
</form>

Berikut ini adalah hasil tampilan dari kode HTML form diatas :

Hasil tampilan form di blog
Hasil tampilan form di blog

atau tampilan form langsungnya adal dibawah ini :

Nama
Password
Hobby Camping Travelling Caving
Jenis Kelamin Pria Wanita
Alamat
Kategori
Pilih File



Sangat mudahkan cara membuat form, Sekarang tinggal kalian mengaplikasikannya.

Share on Facebook
Share on Twitter
Share on Google+

Related : Cara Membuat Form di blog

0 comments: