Form pada HTML

Kali ini saya akan menjelaskan mengenai form, dan fungsinya. Form adalah sebuah tag HTML yang digunakan untuk menginput nilai dari pengguna. Format penulisannya adalah sebagai berikut:

<form> </form>
Form pada HTML


Form seperti selembar kertas kosong yang kemudian harus dituliskan alamat tujuan dan metode pengiriman. Berikut ini tulisan jika sebuah form sudah berisi alamat tujuan dan metode pengiriman.

<form action="url" method="GET/POST">
   <!-- elemen form -->
</form>

Pada properti action url diisi sesuai dengan alamat file tujuan sedangkan method dipilih GET atau POST.


Setelah selembar form disiapkan dengan baik, selanjutnya anda tinggal menambahkan elemen form. Catatan, tag form tidak memberi efek tampilan di layar sedangkan elemen form akan tampil dilayar.

Ada banyak elemen form, elemen-elemen tersebut seperti:
  1. Input Type Text
  2. Input Type Number
  3. Textarea
  4. Select
  5. Radio
  6. Checkbox
  7. Submit fungsinya memulai pengiriman form/formulir
  8. Button fungsinya sebagai objek link
Kodenya seperti berikut:
  1. <input type="text" name="nama">
  2. <input type="number" name="jumlah">
  3. <textarea col="1" row="2" name="komentar"> Tulis..</textarea>
  4. <select name="negara">
    <option value="indonesia">Indonesia</option>
    <option value="malaysia">Malaysia</option>
    <option value="Singapura">Singapura</option>
    </select>
  5. <input type="radio" name="gender" value="L"> Laki-laki
    <input type="radio" name="gender" value="P"> Perempuan
  6. <input type="checkbox" name="hobi1" value="putsal"> Putsal
    <input type="checkbox" name="hobi2" value="renang"> Renang
  7. <input type="submit" value="Simpan">
  8. <input type="button" value="Batal">
Tampilannya seperti ini:
  1. Laki-laki Perempuan
  2. Putsal Renang
Properti name sangat penting bagi form, name inilah yang akan membawa nilai yang diinputkan maka perhatikan dengan baik penulisan name yang benar.

untuk membuat dan menjalankan form anda tidak butuh server (buka langsung di web browser), tetapi untuk mengabil datanya anda butuh server, seperti contoh ini menggunakan server apache dengan bahasa pemrograman PHP.

buat sebuah file dengan nama inputnama.php kodenya sebagai berikut:

<html>
 <head>
  <title>Input Nama</tile>
 </head>
 <body>
 <form action="aksi_inputnama.php" method="POST">
  <input type="text" name="nama">
  <input type="submit" value="proses">
 </form>
 </body>
<html>

buat sebuah file untuk menerima data dengan nama aksi_inputnama.php kodenya sebagai berikut:

<?php
 echo $_POST['nama'];
?>
Terimakasi telah membaca semoga bermanfaat.

Baca Juga Tips Belajar HTML



Popular posts from this blog

Cara Membuat Kalkulator Dengan Java Script

Cara membuat Link ke Halaman lain dan Link ke bagian Halaman

Aplikasi CRUD menggunakan Template Admin LTE