Home  ›  Pemrograman  ›  PHP  ›  Tutorial  ›  Website

[ TUTORIAL PHP #7 ] - Form

at Post a Comment

Apa itu Form

Form digunakan untuk menerima inputan yang berasal dari user dan mengolah hasil inputan tersebut ke server. Form dibuat dengan tag-tag HTML. Halaman yang mengandung form murni (tidak ada script php) tidak harus disimpan dalam bentuk php, bisa dalam bentuk html. Untuk merancang sebuah form inputan, setidaknya ada 3 (tiga) hal penting, yaitu:
  • METHOD
Method dari sebuah form menentukan bagaimana data inputan form dikirim. Method ini ada dua macam, yaitu GET dan POST. Method ini menentukan bagaimana data inputan dikirim dan diproses oleh PHP. Apa perbedaan antara GET dan POST? perbedaannya yaitu, POST akan mengirimkan data tanpa menampilkan pada URL, sedangkan GET akan menampilkan data pada URL.
  • ACTION
Action dari sebuah form menentukan dimana data inputan dari form diproses. Jika action ini dikosongkan, maka dianggap proses form terjadi di halaman yang sama. Jadi halaman form dan halaman proses bisa saja dipisah atau dijadikan satu.
  • SUBMIT BUTTON
Submit button merupakan sebuah tombol (pada umumnya) yang berfungsi sebagai trigger pengiriman data dari form inputan. Jika tombol ini ditekan, maka data form akan dikirimkan (diproses) di halaman yang sudah ditentukan pada atribut action.

Cara Menggunakan Form

Cara 1 : Menyatukan form dan proses

Ketikkan program dibawah ini:

<html>
<head><title>Form Kitahu Komputer</title></head>
<body>
<form method="POST" action = "" name="input">
Masukkan Nama Anda : <input type="text" name="nama"><br>
<input type="submit" name="Input">
</form>
</body>
</html>


<?php
if (isset($_POST['Input'])) {
    $nama = $_POST['nama'];
    echo "Nama Anda : <b>$nama</b>";
}
?>

Hasilnya (Sama seperti latihan tutorial 2):

Cara 2 : Memisahkan form dan proses

buatlah file bernama "index.html" dan ketikkan program dibawah ini: 

<html>

<head>
    <title>Form Kitahu Komputer</title>
</head>

<body>
    <form method="POST" action="proses.php" name="input">
        Masukkan Nama Anda : <input type="text" name="nama"><br>
        <input type="submit" name="Input">
    </form>
</body>

</html>

kemudian buat file bernama "proses.php" dan ketikkan program dibawah ini:

<?php
if (isset($_POST['Input'])) {
    $nama = $_POST['nama'];
    echo "Nama Anda : <b>$nama</b>";
}
?>

Hasilnya:
PENJELASAN:

 Beberapa hal yang perlu diperhatikan yaitu nama (name="Input") setiap komponen form, karena nama ini akan menjadi index array dalam PHP. Pada program cara 1, action="" pada tag form tidak diisi, ini berarti bahwa proses pengolahan form berada di halaman yang sama. pada progtam cara 2, action="proses.php" berarti ketika tombolnya diklik berarti akan mengirimkan datanya ke file proses.php. Selanjutnya method yang digunakan adalah POST. Berarti data dikirimkan melalui latar belakang. Cobalah methodnya diganti menjadi GET (method="GET") maka data akan dikirim melalui URL. Contohnya seperti ini:

Macam-macam TYPE

Buat file bernama "index.html" kemudian ketikkan program:

<html>

<head>
    <title>Pendaftaran Kitahu Komputer</title>
</head>

<body>
    <form method="post" action="proses.php">
        <h1 align="center">FORM PENDAFTARAN</h1>
        <table align="center">
            <tr>
                <td>Nama Depan</td>
                <td> : </td>
                <td><input type="text" name="nama-depan"></td>
            </tr>
            <tr>
                <td>Nama Belakang</td>
                <td> : </td>
                <td><input type="text" name="nama-belakang"></td>
            </tr>
            <tr>
                <td>Buat Password</td>
                <td>: </td>
                <td><input type="password" name="buat-password"></td>
            </tr>
            <tr>
                <td>Jenis Kelamin</td>
                <td>: </td>
                <td>
                    <input type="radio" name="jenis-kelamin" value="Laki-laki">Laki-laki
                    <input type="radio" name="jenis-kelamin" value="Perempuan">Perempuan
                </td>
            </tr>
            <tr>
                <td>Asal Daerah</td>
                <td>: </td>
                <td>
                    <select name="asal-daerah">
                        <option value="Jakarta">Jakarta</option>
                        <option value="Bandung">Bandung</option>
                        <option value="Bogor">Bogor</option>
                        <option value="Bekasi">Bekasi</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>Alamat Lengkap</td>
                <td>: </td>
                <td>
                    <textarea name="alamat-lengkap" cols="20" rows="5"></textarea>
                </td>
            </tr>
            <tr>
                <td>Hobi</td>
                <td>: </td>
                <td>
                    <input type="checkbox" name="hobi1" value="Coding">Coding<br>
                    <input type="checkbox" name="hobi2" value="Membaca">Membaca<br>
                    <input type="checkbox" name="hobi3" value="Menggambar">Menggambar
                </td>
            </tr>
            <tr>
                <td>
                    <input type="submit" name="daftar" value="Daftar">
                    <input type="reset" name="reset" value="Reset">
                </td>
            </tr>
        </table>
    </form>
</body>

</html>

Kemudian buat file bernama "proses.php" kemudian ketikkan program:

<?php
if (isset($_POST["daftar"])) {
    echo "<h2>Pendaftaran Berhasil</h2>";
    echo "<b>Nama : </b> " . $_POST['nama-depan'] . " " . $_POST['nama-belakang'] . "<br>";
    echo "<b>Password : </b> (disamarkan) <br>";
    echo "<b>Jenis Kelamin : </b> " . $_POST['jenis-kelamin'] . "<br>";
    echo "<b>Asal Daerah : </b> " . $_POST['asal-daerah'] . "<br>";
    echo "<b>Alamat Lengkap : </b> " . $_POST['alamat-lengkap'] . "<br>";
    echo "<b>Hobi : </b> ";
    if (isset($_POST["hobi1"])) {
        echo $_POST["hobi1"] . ", ";
    }
    if (isset($_POST["hobi2"])) {
        echo $_POST["hobi2"] . ", ";
    }
    if (isset($_POST["hobi3"])) {
        echo $_POST["hobi3"] . ", ";
    }
}
?>

Hasilnya:

PENJELASAN

Dalam formulir tersebut ada berapa type, yaitu:

1. Type TEXT

Type ini untuk menginputkan text yang tidak terlalu panjang.

2. Type Submit

Type ini untuk mengirim data ke server.

3. Type Reset

Type ini untuk mereset semua yang sudah diketikkan di form.

4. Type Password

Type ini sama seperti type Text, tapi text nya disamarkan. Fungsinya untuk menginputkan kata sandi.

5. Type Radio

Type ini berfungsi untuk memilih 1 dari beberapa pilihan. Yang perlu diperhatikan adalah name harus sama disemua pilihan.

6. Type Check Box

Type ini mirip seperti type radio, tetapi ini bisa memilih banyak pilihan. Yang harus diperhatikan adalah harus menggunakan if untuk menampilkan data.

7. Type Combo Box

Type ini seperti type radio, tetapi pemilihannya drop down.

8. Type Text Area

Type ini untuk menginputkan text yang panjang dan ukuran form nya bisa ditentukan sendiri.

Latihan Soal

Buatlah program upload tanpa menggunakan database seperti gambar dibawah ini:

Cukup sekian tutorial [ TUTORIAL PHP #7 ] - Form. Comment jika ada yang ditanyakan. Terima kasih.


Thanks : Loka Dwiartara, janius517abat, dumetschool, infopengertian.biz
Pemrograman PHP Tutorial Website
SHARE WhatsApp

Related Posts

Post a Comment

Post a Comment