Anda di halaman 1dari 9

LATIHAN PRAKTIKUM PEMROGRAMAN WEB

BAB : FORM
NAMA : RINDANG HERMA WAHIDAN
NIM : 185150600111010
ASISTEN : 1. MUHAMMAD DANDI DAROJAT
2. MUTHIA MAHARANI
TGL PRAKTIKUM : 28 FEBUARI 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
a. Dengan method post

b. Setelah diganti dengan method get


c.

C. Syntax

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>
1 <body>
2 <form action=”proses.php” method=”get”>
3 <input type=”text” name=”nama”>
4 <input type=”submit” value=”Go”>
5 </form>
6 </body>

D. Penjelasan
Pada method post, nilai yang terinput setelah klik tombol submit tidak terlihat nilainya
pada url. Sedangkan pada method get, nilai yang diinput ditampilkan pada url.

LATIHAN 2
A. Soal
A. Tentukan metode apakah yang cocok untuk digunakan dan beri alasan untuk Form
untuk login.

B. Screenshoot

C. Syntax

D. Penjelasan
Form untuk login lebih cocok menggunakan method post, karena untuk menjaga
keamanan pengguna karena data yang diinput tidak akan ditampilkan pada url.

LATIHAN 2
A. Soal
B. Tentukan metode apakah yang cocok untuk digunakan dan beri alasan untuk Form
untuk mengirim gambar desain poster ke website percetakan.

B. Screenshoot

C. Syntax

D. Penjelasan
Form untuk mengirim gambar desain poster ke website percetakan, lebih cocok
menggunakan method post karena url tidak akan ditampilkan pada url sehingga panjang
url tidak banyak memuat nama dari gambar.

LATIHAN 2
A. Soal
C. Tentukan metode apakah yang cocok untuk digunakan dan beri alasan untuk Form
untuk mencari suatu artikel di situs berita.

B. Screenshoot

C. Syntax

D. Penjelasan
Form untuk mencari suatu artikel di situs berita, lebih cocok menggunakan method get
karena hanya akan menampilkan keyword yang dicari oleh user.

LATIHAN 2
A. Soal
D. Untuk beberapa kasus berikut, tentukan metode apakah yang cocok untuk digunakan
dan beri alasan untuk Form untuk search engine.

B. Screenshoot

C. Syntax

D. Penjelasan
Form untuk search engine, lebih cocok menggunakan method get karena hanya akan
menampilkan keyword yang dicari oleh user

LATIHAN 3
A. Soal
A. 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'])) {
3 $nama = $_POST['nama'];
4 echo "Nama Anda: <b>$nama</b>";
5 }

Jalankan kode di atas kemudian isikan data input dan tekan tombol input. Apa yang
terjadi
B. Screenshoot

C. Syntax

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">
</form>
5

1 <?php
2 if (isset($_POST['input'])) {
3 $nama = $_POST['nama'];
4 echo "Nama Anda: <b>$nama</b>";
}
5

D. Penjelasan
Yang terjadi yaitu memanggil file proses02.php dan mencetak yang telah diinput oleh
user.

LATIHAN 3
A. Soal
B. 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'])) {
3 $nama = $_POST['nama'];
4 echo "Nama Anda: <b>$nama</b>";
5 }

Ulangi dengan mengosongkan data input dan amati apa yang terjadi.
B. Screenshoot

C. Syntax

1 <form action="proses02.php" method="post“


2 name="input">
3 Nama Anda: <input type="text" name="nama" required>
4 <br>
5 <input type="submit" name="input" value="Input">
</form>

1 <?php
2 if (isset($_POST['input'])) {
3 $nama = $_POST['nama'];
4 echo "Nama Anda: <b>$nama</b>";
5 }

D. Penjelasan
Karena user belum menginput apapun namun langsung klik pada submit maka required
akan dijalankan yaitu perintah untuk mengisi input name=“nama”.

LATIHAN 3
A. Soal
C. 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'])) {
3 $nama = $_POST['nama'];
4 echo "Nama Anda: <b>$nama</b>";
5 }
Jelaskan alur pengiriman data dari form yang ada di kode tersebut!

B. Screenshoot

C. Syntax

1 <form action="proses02.php" method="post“


2 name="input">
3 Nama Anda: <input type="text" name="nama" required>
4 <br>
5 <input type="submit" name="input" value="Input">
</form>

1 <?php
2 if (isset($_POST['input'])) {
3 $nama = $_POST['nama'];
4 echo "Nama Anda: <b>$nama</b>";
5 }

D. Penjelasan
Pada tag form di deklarasikan action pada file tersebut yaitu proses02.php dengan
method post dengan name=“input”. Setelah user menginput nilai pada name=“nama” dan
klik submit maka akan memanggil file proses.php. Jika belum menginput namun
langsung klik pada submit maka required akan dijalankan yaitu perintah untuk mengisi
input name=“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 <form action="proses02.php" method="post“


2 name="input">
3 Nama Anda: <input type="text" name="nama">
4 <br>
5 <input type="submit" name="input" value="Input">
</form>

D. Penjelasan
Sebelum required dihapus, muncul warning bahwa user harus menginput sesuatu pada
name=“nama”. Setelah required dihapus, lalu klik tombol submit tanpa menginput maka
file proses02.php akan tetap dijalankan. Jadi fungsi dari kode required yaitu untuk
mencegah user tidak dapat mensubmit data karena input belum diisi. Sehingga untuk
melanjutkan ke action selanjutnya muncul peringatan bahwa user harus mengisi pada
kolom inputan tertentu.

LATIHAN 5
A. Soal
Tulis kode berikut.
1 <form enctype="multipart/form-data" action="upload.php"
method="post">
2 Choose a file to upload:
3 <input name="uploadedfile" type="file" /> <br>
4 <input type="submit" value="Upload File" />
5 </form>

Tulis kode berikut.


1 <?php
2 $target_path = "uploads/";
3 $target_path = $target_path .
basename($_FILES['uploadedfile']['name']);
4
5 if(move_uploaded_file($_FILES['uploadedfile']['tmp_name'],
$target_path)) {
6 echo "The file ". basename( $_FILES['uploadedfile']
7 ['name']). " has been uploaded";
8 } else {
9 echo "There was an error uploading the file, please try
10
11
again!";
}

Di manakah posisi file setelah proses upload berhasil?


Apakah hasil output dari kode tersebut setelah dijalankan?

B. Screenshoot
a. Setelah upload file

b. Lokasi file yang sudah di upload

C. Syntax

1 <form enctype="multipart/form-data"
action="upload.php" method="post">
2 Choose a file to upload:
3 <input name="uploadedfile" type="file" /> <br>
4 <input type="submit" value="Upload File" />
5 </form>
1 <?php
2 $target_path = "uploads/";
3 $target_path = $target_path .
basename($_FILES['uploadedfile']['name']);
4 if(move_uploaded_file($_FILES['uploadedfile']
5 ['tmp_name'], $target_path)) {
6 echo "The file ".
basename( $_FILES['uploadedfile']['name']). " has
7 been uploaded";
} else {
8 echo "There was an error uploading the file,
9 please try again!";
10
11 }

D. Penjelasan
File tersebut tersimpan dalam folder upload pada $target_path. Setelah file terupload,
pada browser menampilkan teks bahwa file telah sukses terupload.

Anda mungkin juga menyukai