Scribd Logo

Bahasa

Unggah

Selamat datang di Scribd!

P Web RPL

Diunggah oleh

Irwan Kurniawan
2 tayangan24 halaman
form

Judul Asli

P web RPL

Hak Cipta

© © All Rights Reserved

Format Tersedia

PPT, PDF, TXT atau baca online dari Scribd

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Laporkan Dokumen Ini

Deskripsi:

form

Hak Cipta:

© All Rights Reserved
Unduh sebagai PPT, PDF, TXT atau baca online dari Scribd
Tandai sebagai konten tidak pantas
2 tayangan24 halaman

P Web RPL

Judul Asli:

P web RPL

Diunggah oleh

Irwan Kurniawan

Deskripsi:

form

Hak Cipta:

© All Rights Reserved
Unduh sebagai PPT, PDF, TXT atau baca online dari Scribd
Tandai sebagai konten tidak pantas
dari 24

Form

Pengertian Form
 Form dalam web adalah satu sarana untuk
memperoleh data dari pengunjung

 Form ibarat formulir dalam dunia nyata, berisi


nama formulir, beberapa pertanyaan, bagian
untuk mengisi jawaban, dengan satu tujuan
tertentu.

 Data yang terkumpul digunakan oleh pembuat


formulir untuk suatu kebutuhan si pembuat
Membuat FORM
 Form dibuat menggunakan elemen FORM
dan elemen INPUT.

<form>
<input>
<input>
</form>
Atribut-atribut FORM
 Elemen FORM memiliki atribut :
 Action
 Method
 Name

 Elemen INPUT memiliki atribut :


 Type
 Name
 Size
 Maxlength
Contoh FORM
<form action=“” method=“post” name=“form”>
Nama : <input type=“text” name=“nm”>
<input type=“submit” value=“OK” name=“proses”>
</form>
3 Hal Penting FORM
 Method
Method form menentukan bagaimana data inputan form
dikirim dan diproses. Ada 2 macam method : POST dan
GET

 Action
Action form menentukan file pemroses data inputan
form. Jika action ini dikosongkan (action=“”) maka
dianggap pemrosesan data inputan form dilakukan di
halaman yang sama. Jadi halaman form dan pemroses
bisa dipisah atau dijadikan satu

 Submit button
Tombol yang berfungsi sebagai trigger (pemicu)
pengiriman data dari form ke pemroses.
Berbagai cara Penanganan FORM

 Menyatukan antara form dan pemroses


Form inputan dan proses pengolahan form
dilakukan di halaman yang sama. Dengan
cara ini, atribut action dikosongkan
(action=“”)
Contoh coding FORM
<html>
<head><title>Pengolahan form</title></head>
<body>
<form action=“” method=“post” name=“myform”>
Nama : <input type=“text” name=“nm” size=“25”>
<input type=“submit” value=“simpan” name=“spn”>
</form>
<?php
//pemroses data inputan form
If (isset($_POST[‘spn’])){
$nama=$_POST[‘nm’];
echo “Nama Anda : <b>$nama</b>”;}
?>
</body>
</html>
Berbagai cara Penanganan FORM

 Memisahkan form dan pemrosesnya


Proses pengolahan form dilakukan di
halaman yang terpisah dengan form
inputannya. Jika memakai cara ini, atribut
action diisi dengan nama file pemroses
data inputan form
Contoh coding FORM
File halaman form (form1.html):

<html>
<head><title>Pengolahan form</title></head>
<body>
<form action=“simpan.php” method=“post” name=“myform”>
Nama : <input type=“text” name=“nama” size=“25”>
<input type=“submit” value=“simpan” name=“simpan”>
</form>
</body>
</html>
Contoh coding FORM

File halaman pemroses data inputan form (simpan.php) :

<?php
If (isset($_POST[‘simpan’]))
{
$nama=$_POST[‘nama’];
echo “Nama Anda : <b>$nama</b>”;
}
?>
Method GET
 Metode GET digunakan bila data yang dikirim
sedikit.

 Metode ini menggunakan $_GET untuk


memproses data.

 Data yang dikirim dengan metode ini akan


tampak pada URL di address bar browser shg
tidak aman untuk data sensitif (misalnya
password).
Contoh coding Method Get
<html>
<head><title>Pengolahan form</title></head>
<body>
<form action=“” method=“get” name=“myform”>
Nama : <input type=“text” name=“nama” size=“25”>
<input type=“submit” value=“simpan” name=“simpan”>
</form>

<?php
If (isset($_GET[‘simpan’]))
{
$nama=$_GET[‘nama’];
echo “Nama Anda : <b>$nama</b>”;
}
?>
</body>
</html>
/Form01.php?nama=Joko+Santosa&simpan=simpan

Disebut QUERY STRING


Method POST
 Metode POST menggunakan variabel
array $_POST

 Mampu menyimpan data dalam jumlah


banyak

 Datanya disimpan dalam tempat tersendiri


dan tidak tergantung pada suatu variabel
Elemen-elemen INPUT
 Text
<form action=“” method=“post”>
Usia :
<input type=“text” name=“tgl” size=“3” maxlength=“5”>
<input type=“submit” value=“OK” name=“tombol”>
</form>
Atribut type menentukan jenis elemen input yang akan
dibuat.
Atribut name memberi nama inputan tersebut.
Size menentukan lebar kotak input.
Maxlength menentukan maksimal karakter yang dapat
diinputkan dalam kotak input
Elemen-elemen INPUT
 Password
<form action=“” method=“post”>
Password :
<input type=“password” name=“pswd” size=“15”
maxlength=“20”>
<input type=“submit” value=“send” name=“proses”>
</form>
Elemen input tipe password tidak akan menampilkan
karakter yang diinputkan pada kotak input dan diganti
dengan karakter “*”
Elemen-elemen INPUT
 Hidden
<form action=“” method=“post”>
Password :
<input type=“hidden” name=“hdd” size=“15”
maxlength=“20”>
<input type=“submit” value=“send”
name=“proses”>
</form>
Elemen input tipe hidden akan menyembunyikan
karakter yang diinputkan pada kotak input.
Elemen-elemen INPUT
 Radio
<form action=“” method=“post”>
Jenis kelamin :
<input type=“radio” name=“j_kel” value=“pria”>Pria
<input type=“radio” name=“j_kel” value=“wanita”>Wanita
<input type=“submit” value=“send” name=“proses”>
</form>
Nama elemen input tipe radio harus sama untuk satu
inputan. Atribut value untuk menentukan nilai data yang
akan dikirim ke pemroses
Elemen-elemen INPUT
 Checkbox
<form action=“” method=“post”>
Hoby :
<input type=“checkbox” name=“hb1” value=“Catur”>Catur
<input type=“checkbox” name=“hb2”
value=“game”>Game
<input type=“submit” value=“send” name=“proses”>
</form>
Nama elemen input tipe checkbox berbeda untuk satu
inputan. Atribut value untuk menentukan nilai data yang
akan dikirim ke pemroses
Elemen-elemen INPUT
 Select
<form action=“” method=“post”>
Band favorit :
<select name=“band” size=3 multiple>
<option value=“Dmasiv”>D’masiv
<option value=“Peterpan” selected>Peterpan
<option value=“Raja”>Raja
</select>
<input type=“submit” value=“send” name=“proses”>
</form>
Elemen option digunakan untuk membuat pilihan-pilihan
pada inputan
Elemen-elemen INPUT

 Textarea
<form action=“” method=“post”>
Pesan :
<textarea name=“psn” rows=“5” cols=“70”>
</textarea>
<input type=“submit” value=“send” name=“proses”>
</form>
Atribut rows untuk mengatur tinggi (jumlah baris yang
tampak) dan cols mengatur lebar kotak inputan
Elemen-elemen INPUT
 Tombol
Ada beberapa jenis tombol :
 tombol submit
<input type=“submit” value=“OK”>
 Tombol reset
<input type=“reset” value=“batal”>
 Tombol general
<input type=“button” value=“hitung” onclick=“script()”>
Tombol reset untuk membatalkan pengiriman data
inputan form sedang tombol general dapat digunakan
untuk bermacam-macam fungsi.
Latihan
<form name=“login” action=“” method=“post>
Password :
<input type=“password” name=“psw” size=“15” maxlength=“10”>
<input type=“submit” value=“login” name=“tlogin”>
</form>
<?php
If (isset($_POST[‘tlogin’])){
if ($_POST[‘psw’]==“admin”){
echo “Login sukses”;
}else{
echo “Anda tidak berhak menggunakan sistem”;
}
}
?>

Anda mungkin juga menyukai