M.ro'if Bab7

LATIHAN PRAKTIKUM PEMROGRAMAN WEB
BAB : FORM
NAMA : M. RO’IF
NIM : 185150601111017
ASISTEN : 1. MUHAMMAD DANDI DAROJAT
2. MUTHIA MAHARANI
TGL PRAKTIKUM: 28 FEBRUARI 2020
LATIHAN 1
A. Soal
Tulis kode berikut.
1 <body>
2 <form action=”proses.php” method=”post”>
3 <input type=”text” name=”nama”>
4 <input type=”submit” value=”Go”>
5 </form>
6 </body>
Jalankan kode tersebut di browser lalu ganti metodenya dengan GET. Lihat perbedaannya
pada URL di browser. Beri kesimpulan.
B. Screenshoot
- Method POST
- Setelah diganti Method GET

C. Syntax
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>Document</title>
5 </head>
6 <body>
7 <form action="proses.php" method="post">
8 <input type="text" name="nama">
9 <input type="submit" value="Go">
10 </form>
11 </body>
12 </html>
1 <?php
2 $nama = $_POST['nama'];
D. Penjelasan
Terjadi perbedaan pada url program tersebut, jika menggunakan method GET, maka
nilai yang di input akan muncul pada url, sedangkan jika menggunakan method POST nilai
tidak dimunculkan di url
LATIHAN 2
A. Soal
Untuk beberapa kasus berikut, tentukan metode apakah yang cocok untuk digunakan dan
beri alasan.
1. Form untuk login.
2. Form untuk mengirim gambar desain poster ke website percetakan.
3. Form untuk mencari suatu artikel di situs berita.
4. Form untuk search engine.
B. Screenshoot
C. Syntax
D. Penjelasan
Form untuk login lebih cocok menggunakan method POST, karena form login pada
umumnya menyimpan informasi rahasia yang hanya diketahui oleh user dan tidak untuk
ditampilkan pada umum, seperti password. dan Untuk form untuk mengirim gambar desain
poster ke website percetakan juga lebih cocok menggunakan method POST karena gambar
tersebut tidak diperlukan untuk ditampilkan secara umum. Sedangkan untuk form mencari
suatu artikel di situs berita lebih cocok menggunakan method GET, karena informasi bisa
lebih mudah dicari apabila ditampilkan pada url. dan Tak jauh berbeda, form untuk search
engine juga lebih cocok menggunakan method GET, karena informasi akan lebih mudah
diketahui jika ditampilkan pada url
LATIHAN 3
A. Soal
Tulis kode di bawah ini.
1 <form action="proses02.php" method="post“ name="input">
2 Nama Anda: <input type="text" name="nama" required>
3 <br>
4 <input type="submit" name="input" value="Input">
5 </form>
Kemudian tulis kode di bawah ini.

1 <?php
2 if (isset($_POST['input'])) {
4 echo "Nama Anda: <b>$nama</b>";
5 }
a. Jalankan kode di atas kemudian isikan data input dan tekan tombol input. Apa yang
terjadi?
b. Ulangi dengan mengosongkan data input dan amati apa yang terjadi.
c. Jelaskan alur pengiriman data dari form yang ada di kode tersebut!
B. Screenshoot
- Alamat input dikosongkan
C. Syntax
1 <!DOCTYPE html>
2 <html>
3 <head>
5 </head>
6 <body>
7 <form action="proses02.php" method="post"
8 name="input">
9 Nama Anda: <input type="text" name="nama"
10 required>
11 <br>
12 <input type="submit" name="input"
13 value="Input">
14 </form>
15 </body>
16 </html>
1 <?php
5 }
D. Penjelasan
Program di atas memiliki fungsi seperti login, dimana jika kita mengisikan nama kita
pada textbox tersebut, maka akan diarahkan pada halaman selanjutnya yang berisi
informasi mengenai nama Anda
Ketika alamat input dikosongkan, maka program tidak akan berjalan, karena terdapat
fungsi “required” dimana jika terdapat fungsi ini, maka kode/textbox tersebut tidak boleh
kosong alias harus diisi
Pertama user diminta mengisikan nama mereka pada input yang berupa “text” dan
memiliki nama = “nama” dan juga memiliki fungsi “required” yang berarti tidak boleh
kosong, selanjutnya setelah diisi, apabila user meng-klik tombol “submit” akan langsung
diarahkan ke halaman proses02.php dengan menggunakan method “POST”, lalu di dalam
proses02.php, terdapat seleksi kondisi if, dimana jika jika yang sedang diterima adalah dari
Form yang bernama ‘input maka nama yang telah di inputkan kita tadi akan diinisialisasi
kedalam variable $nama dan akan di-echo “Nama Anda: (Nama yang diinputkan tadi)/(nilai
dari variable nama).
LATIHAN 4
A. Soal
Ubah kembali kode pada Latihan 3 dengan menghapus tulisan required pada baris 2.
Jalankan kode dan kosongi data nama kemudian tekan tombol Input. Apa yang terjadi?
Jelaskan apa fungsi dari kode required.
B. Screenshoot
C. Syntax
1 <!DOCTYPE html>
2 <html>
3 <head>
5 </head>
6 <body>
7 <form action="proses02.php" method="post"
8 name="input">
9 Nama Anda: <input type="text" name="nama">
10 <br>
11 <input type="submit" name="input"
12 value="Input">
13 </form>
14 </body>
15 </html>
1 <?php
5 }
D. Penjelasan
Program akan tetap berjalan walaupun input dari user dikosongi, karena tidak adanya
fungsi “required” yang berarti program tidak boleh kosong, maka program dapat dijalankan
walaupun dengan kondisi textbox kosong.
LATIHAN 5
A. Soal
Tulis kode berikut.
1 <form enctype="multipart/form-data" action="upload.php"
2 method="post">
3 Choose a file to upload:
4 <input name="uploadedfile" type="file" /> <br>
5 <input type="submit" value="Upload File" />
</form>
Tulis kode berikut.

1 <?php
2 $target_path = "uploads/";
3 $target_path = $target_path .
4 basename($_FILES['uploadedfile']['name']);
5
6 if(move_uploaded_file($_FILES['uploadedfile']['tmp_name'],
7 $target_path)) {
8 echo "The file ". basename(
9 $_FILES['uploadedfile']['name']). " has been uploaded";
10 } else {
11 echo "There was an error uploading the file, please try
again!";
}
Di manakah posisi file setelah proses upload berhasil? Apakah hasil output dari kode
tersebut setelah dijalankan?
B. Screenshoot
C. Syntax
1 <!DOCTYPE html>
2 <html>
3 <head>
5 </head>
6 <body>
7 <form enctype="multipart/form-data"
8 action="upload.php" method="post">
9 Choose a file to upload:
10 <input name="uploadedfile" type="file" />
11 <br>
12 <input type="submit" value="Upload File" />
13 </form>
14 </body>
15 </html>
1 <?php
2 $target_path = "uploads/";
3 $target_path =
4 $target_path.basename($_FILES['uploadedfile']['name'
5 ]);
6 if(move_uploaded_file($_FILES['uploadedfile']['tmp_n
7 ame'], $target_path)) {
8 echo "The file ".
9 basename( $_FILES['uploadedfile']['name']). " has
10 been uploaded";
11 } else {
12 echo "There was an error uploading the file,
13 please try again!";
14 }
D. Penjelasan
Program di atas memiliki fungsi upload file, dimana file yang kita pilih akan di upload
pada folder uploads di htdoc xampp, program akan meminta kita untuk memilih file pada
direktori kita, setelah kita memilih file dan meng-klik tombol upload file, maka file akan
terupload pada folder uploads yang sebelumnya telah kita buat

M.ro'if Bab7

Diunggah oleh

Informasi Dokumen

Deskripsi Asli:

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

M.ro'if Bab7

Diunggah oleh

Hak Cipta:

Format Tersedia

LATIHAN PRAKTIKUM PEMROGRAMAN WEB

- Setelah diganti Method GET

Kemudian tulis kode di bawah ini.

Tulis kode berikut.

Anda mungkin juga menyukai