Laporan praktikum bengkel web dengan PHP

LAPORAN PRAKTIKUM
BENGKEL WEB 2
MODUL 9 – MODUL 11
OKTA RIVERANDA
1257301042
PANDU HARRIEN FITRA
1257301043

Modul 9. PHP dan Database MySQL [3]
1. Menu Mahasiswa
Script Penjelasan
<?php
include_once "konek.php";
?>
<html>
<head>
<title>Menu Mahasiswa</title>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body topmargin="50">
<table width="600" align="center">
<tr>
<th>No.</th>
<th>Nama</th>
<th>NIM</th>
<th>Kelas</th>
<th>Username</th>
<th>Aksi</th>
</tr>
<?php
$query = mysqli_query($con, "SELECT * FROM
mahasiswa");
$i = 1;
while($row = mysqli_fetch_array($query)){
echo "<tr>";
echo "<td align='center' nowrap>";
echo $i;
echo "</td>";
echo $row['nama'];
echo "</td>";
echo $row['nim'];
echo "</td>";
echo $row['kelas'];
echo "</td>";
echo $row['username'];
echo "</td>";
?>
Script ini merupakan script
yang digunakan untuk menampilkan
data Mahasiswa yang diambil dari tabel
mahasiswa pada database bw2db.
Beberapa hal yang menjadi poin
penting dari menu mahasiswa ini
adalah, adanya aksi untuk edit dan
hapus, yang memberikan kemudahan
bagi admin untuk mengubah atau
menghapus data yang diinginkan.
Oleh karena terdapat aksi edit
dan hapus, maka pada script ini,
ditambahkan link berupa URL dari
form update atau hapusDB. Lalu di
akhir URL, ditambahkan satu nama
field yang merupakan identitas dari data
yang akan diubah/dihapus dan
menginisialisasinya sesuai dengan data
yang dilooping. Method yang
digunakan adalah method get, sehingga
data id akan langsung disimpan dalam
URL di browser yang akan tampak jelas
sesaat setelah kita mengklik tombol
edit/hapus pada data yang dituju.

<a href="Modul_9_FormUpdate.php?id=<?php echo
$row['id']; ?>">Update</a> |
<a href="Modul_9_HapusDB.php?id=<?php echo $row['id'];
?>">Drop</a>
<?php
echo "</td>";
echo "</tr>";
$i++;
}
?>
<tr>
<td colspan="6" align="right">
<a href="Modul_9_FormInsert.php" style="text-
decoration:none;" id="bg">Tambah</a></td>
</tr>
</table>
</body>
</html>
Output

2. Form Insert Mahasiswa
Script
<html>
<head>
<title>Tambah Mahasiswa</title>
</head>
<body>
<form action="Modul_9_InsertDB.php" method="post">
<table align="center">
<tr>
<th colspan="2">
Tambah Mahasiswa
</th>
</tr>
<tr>
<td>Nama</td>
<td> : <input type="text" name="nama" maxlength="30" size="30"></td>
</tr>
<tr>
<td>NIM</td>
<td> : <input type="text" name="nim" size="30" maxlength="5"></td>
</tr>
<tr>
<td>Kelas</td>
<td> : <input type="text" name="kelas" size="30" maxlength="4"></td>
</tr>
<tr>
<td>Username</td>
<td> : <input type="text" name="username" size="30" maxlength="10"></td>
</tr>
<tr>
<td>Password</td>
<td> : <input type="password" name="password" size="30" maxlength="30"></td>
</tr>
<tr>
<td>re-Password</td>
<td> : <input type="password" name="repassword" size="30" maxlength="30"></td>
</tr>
<tr>
<td colspan="2" align="center"><button type="submit">Tambah</button><button
type="reset">Batal</button></td>
</tr>
</table>
</form>
</body>
</html>

Penjelasan
Program di atas adalah program yang digunakan untuk menampilkan form untuk inputan data
mahasiswa. File ini memiliki link dengan file lain, yakni Modul_9_InsertDB, file yang merupakan file
verifikasi atas data yang diinputkan.
Output
3. File verifikasi InsertDB
Script
<?php
$nama = addslashes(strip_tags($_POST['nama']));
$nim = addslashes(strip_tags($_POST['nim']));
$kelas = addslashes(strip_tags($_POST['kelas']));
$username = addslashes(strip_tags($_POST['username']));
$password = addslashes(strip_tags($_POST['password']));
$repassword = addslashes(strip_tags($_POST['repassword']));
$error;
$counter=0;
$count=1;
function cekNama($nama){
global $error;
global $counter;
if(filter_var($nama, FILTER_VALIDATE_INT)){
$error[] = "Data nama harus String !";
$counter++;
}
}function cekNim($nim){
global $error;
global $counter;
if(!filter_var($nim, FILTER_VALIDATE_INT)){
$error[] = "Data NIM harus integer !";
$counter++;

}
}
cekNama($nama);
cekNim($nim);
if(empty($nama)){
$error[] = "Data nama kosong !";
$counter++;
}if(empty($nim)){
$error[] = "Data NIM kosong !";
$counter++;
}if(empty($kelas)){
$error[] = "Data kelas kosong !";
$counter++;
}if(empty($username)){
$error[] = "Data username kosong !";
$counter++;
}if(empty($password)){
$error[] = "Data password kosong !";
$counter++;
}if(empty($repassword)){
$error[] = "Data re-password kosong !";
$counter++;
}if($password != $repassword){
$error[] = "Password tidak cocok !";
$counter++;
}if($counter>0){
include_once "Modul_9_Tambah.php";
echo "<center>";
echo "<b>Kesalahan Input : <br /></b>";
foreach($error as $tampil){
echo "<font color='#FF0000' size='+1'>";
echo $count.". ".$tampil."<br />";
$count++;
echo "</font>";
}
echo "</center>";
}else{
$query = mysqli_query($con, "INSERT INTO mahasiswa (nama, nim, kelas, username,
password) VALUES('$nama', '$nim', '$kelas', '$username', '".md5($password)."')");
echo "<center>";
echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
echo "Data Berhasil Ditambahkan";
echo "</font>";
echo "</center>";
include_once "Modul_9_MenuMahasiswa.php";
}
?>

Penjelasan
Pada file ini terdapat :
- Inisialisasi variabel input yang menggunakan method POST.
- Error handling beserta fungsi filtering untuk memeriksa inputan apakah ada yang salah atau
masih kosong (belum diinput).
- Menampilkan kesalahan yang sebelumnya telah ditampun ke dalam suatu list array.
- Proses pemasukan data ke dalam tabel mahasiswa.
Output
Merupakan hasil pengecekan dari file verifikasi Modul_9_InsertDB.php. Hasil yang ditampilkan
merupakan kesalahan – kesalahan dalam proses posting, yang terdiri dari beberapa kesalahan setelah
ditampun didalam list array.

4. Form Update Mahasiswa
Script
<?php
if(!empty($_GET['id'])){
$query = mysqli_query($con, "SELECT * FROM mahasiswa WHERE id = $_GET[id]");
$data = mysqli_fetch_array($query);
?>
<html>
<head>
<title>Ubah Form</title>
</head>
<body>
<form action="Modul_9_UpdateDB.php" method="post">
<input type="hidden" name="id" maxlength="30" size="30" value="<?php echo
$_GET['id']; ?>">
<tr>
<th colspan="2">
Ubah Mahasiswa
</th>
</tr>
<tr>
<td>Nama</td>
<td> : <input type="text" name="nama" maxlength="30" size="30" value="<?php echo
$data['nama']; ?>"></td>
</tr>
<tr>
<td>NIM</td>
<td> : <input type="text" name="nim" size="30" maxlength="5" value="<?php echo
$data['nim']; ?>"></td>
</tr>
<tr>
<td>Kelas</td>
<td> : <input type="text" name="kelas" size="30" maxlength="4" value="<?php echo
$data['kelas']; ?>"></td>
</tr>
<tr>
<td>Username</td>
<td> : <input type="text" name="username" size="30" maxlength="10" value="<?php echo
$data['username']; ?>"></td>
</tr>
<tr>
<td>Password</td>
<td> : <input type="password" name="password" size="30" maxlength="30" value="<?php
echo $data['password']; ?>"></td>

</tr>
<tr>
<td>re-Password</td>
<td> : <input type="password" name="repassword" size="30" maxlength="30"
value="<?php echo $data['password']; ?>"></td>
</tr>
<tr>
<td colspan="2" align="center"><button type="submit">Ubah</button><button
</tr>
</table>
</form>
</body>
</html>
<?php
}
?>
Penjelasan
Memiliki bentuk yang sama dengan form insert, hanya saja, pada apabila ingin mengakses form
update, maka harus ada id atau variabel yang diambil, semisal id yang merupakan variabel tempat
menyimpan data id mahasiswa. Variabel ini digunakan untuk menampilkan data yang akan diubah, karena
untuk mengubah data, berarti hanya satu data saja yang dipilih, sehingga data dengan id yang diambil
dengan method GET saja yang bisa diubah pada form update.
Output
Data ujang diambil dari id = 1.

5. Update DB
Script
<?php
$nim = addslashes(strip_tags($_POST['nim']));
$kelas = addslashes(strip_tags($_POST['kelas']));
$username = addslashes(strip_tags($_POST['username']));
$password = addslashes(strip_tags($_POST['password']));
$repassword = addslashes(strip_tags($_POST['repassword']));
$id = addslashes(strip_tags($_POST['id']));
$error;
$counter=0;
$count=1;
global $error;
global $counter;
$counter++;
}
}function cekNim($nim){
global $error;
global $counter;
if(!filter_var($nim, FILTER_VALIDATE_INT)){
$error[] = "Data NIM harus integer !";
$counter++;
}
}
cekNama($nama);
cekNim($nim);
if(empty($nama)){
$counter++;
}if(empty($nim)){
$error[] = "Data NIM kosong !";
$counter++;
}if(empty($kelas)){
$error[] = "Data kelas kosong !";
$counter++;
}if(empty($username)){
$error[] = "Data username kosong !";
$counter++;
}if(empty($password)){

$error[] = "Data password kosong !";
$counter++;
}if(empty($repassword)){
$error[] = "Data re-password kosong !";
$counter++;
}if($password != $repassword){
$error[] = "Password tidak cocok !";
$counter++;
}if($counter>0){
include_once "Modul_9_FormUpdate.php";
echo "<center>";
$count++;
echo "</font>";
}
echo "</center>";
}else{
mysqli_query($con, "UPDATE mahasiswa SET nama = '$nama', nim = '$nim', kelas = '$kelas', username
= '$username', password = '$password' WHERE id = '$id'");
echo "<center>";
echo "Data Berhasil Diubah";
echo "</font>";
echo "</center>";
}
?>
Penjelasan
Syntax ini merupakan syntax yang digunakn untuk memverifikasi atau syntax yang dilinkan dari
file Modul_9_FormUpdate.php. Syntax ini berfungsi untuk memastikan inputan yang diinputkan dari
form update telah benar dan dapat diproses di query database.

Output
Sebelumnya, username dari id = 1, adalah ujang, kemudian setelah diubah pada form update,
berubah menjadi UJANG.
6. Hapus DB
Script
<?php
if(!empty($_GET['id'])){
$query = mysqli_query($con, "DELETE FROM mahasiswa WHERE id = $_GET[id]");
echo "<center>";
echo "Data Berhasil Dihapus";
echo "</font>";
echo "</center>";
}
?>
Penjelasan
HapusDB merupakan file PHP yang digunakan untuk menghapus data tunggal dari tabel
mahasiswa yang terdapat pada database bw2db. Penghapusan ini didasarkan pada data id dari salah satu
data pada tabel mahasiswa. Id ini diambil dari URL yang telah dikirimkan sebelumny dengan
menggunakan method GET. Kondisi if(!empty($_GET[‘id’])){ }, merupakan kondisi untuk memastikan
bahwa variabel dari method GET telah terisi dan siap untuk di query.

Output
Sebelum dihapus Setelah dihapus
7. Tugas 4 Menu Mata Kuliah
Script Penjelasan
<?php
?>
<html>
<head>
<title>Menu Mata Kuliah</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body topmargin="50">
<table width="800" align="center">
<tr>
<th>Nomor</th>
<th>Nama Mata Kuliah</th>
<th>Kode Mata Kuliah</th>
<th>Dosen Pengampu</th>
<th>Aksi</th>
</tr>
<?php
$query = mysqli_query($con, "SELECT * FROM
matakuliah");
$i = 1;
while($row = mysqli_fetch_array($query)){
echo "<tr>";
echo $i;
echo "</td>";
echo $row['mk_nama'];
Script ini merupakan script
yang sama halnya dengan script menu
mahasiswa, hanya saja, perbedaannya
terletak pada data yang ditampilkan
pada file ini. Pada file ini, yang menjadi
data keluaran adalah data pada tabel
matakuliah.

echo "</td>";
echo $row['mk_kode'];
echo "</td>";
echo $row['mk_dosen'];
echo "</td>";
?>
<a href="Tugas4_FormUpdate.php?mk_id=<?php
echo $row['mk_id'] ?>">Update</a> |
<a href="Tugas4_HapusDB.php?mk_id=<?php echo
$row['mk_id'] ?>">Drop</a>
<?php
echo "</td>";
echo "</tr>";
$i++;
}
?>
<tr>
<td colspan="6" align="right"><a
href="Tugas4_FormInsert.php" style="text-decoration:none;"
id="bg">Tambah</a></td>
</tr>
</table>
</body>
</html>
Output

8. Tugas 4 Form Insert Mata Kuliah
Script
<html>
<head>
<title>Tambah Mata Kuliah</title>
<link rel="stylesheet" type="text/css" href="style.css"> </head>
<body>
<form action="Tugas4_InsertDB.php" method="post">
<tr>
<th colspan="2">
Tambah Mata Kuliah
</th>
</tr>
<tr>
<td>Nama Mata Kuliah</td>
<td> : <input type="text" name="nama" maxlength="30" size="30"></td>
</tr>
<tr>
<td>Kode Mata Kuliah</td>
<td> : <input type="text" name="kode" size="30" maxlength="5"></td>
</tr>
<tr>
<td>Dosen Pengampu</td>
<td> : <input type="text" name="dosen" size="30" maxlength="50"></td>
</tr>
<tr>
<td colspan="2" align="center"><button type="submit">Tambah</button><button
</tr>
</table>
</form>
</body>
</html>
Penjelasan
Program di atas adalah program yang digunakan untuk menampilkan form untuk inputan data
matakuliah. File ini memiliki link dengan file lain, yakni Tugas_4_InsertDB.php, file yang merupakan file
verifikasi atas data yang diinputkan.
Output

9. Tugas 4 File verifikasi InsertDB
Script
<?php
$namaMk = addslashes(strip_tags($_POST['nama']));
$kodeMk = addslashes(strip_tags($_POST['kode']));
$dosenMk = addslashes(strip_tags($_POST['dosen']));
$error;
$counter=0;
$count=1;
function cekNama($namaMk){
global $error;
global $counter;
if(filter_var($namaMk, FILTER_VALIDATE_INT)){
$counter++;
}
}
cekNama($namaMk);
if(empty($namaMk)){
$counter++;
}if(empty($kodeMk)){
$error[] = "Data Kode Mata Kuliah kosong !";
$counter++;
}if(empty($dosenMk)){
$error[] = "Data Dosen kosong !";
$counter++;
}if($counter>0){
include_once "Tugas4_FormInsert.php";
echo "<center>";
$count++;
echo "</font>";
}
echo "</center>";
}else{
$query = mysqli_query($con, "INSERT INTO matakuliah (mk_nama, mk_kode, mk_dosen)
VALUES('$namaMk', '$kodeMk', '$dosenMk')");
echo "<center>";

echo "</font>";
echo "</center>";
include_once "Tugas4_MenuMataKuliah.php";
}
?>
Penjelasan
Pada file ini terdapat :
- Inisialisasi variabel input yang menggunakan method POST.
- Error handling beserta fungsi filtering untuk memeriksa inputan apakah ada yang salah atau
masih kosong (belum diinput).
- Menampilkan kesalahan yang sebelumnya telah ditampun ke dalam suatu list array.
- Proses query data ke dalam tabel matakuliah.
Output
Merupakan hasil pengecekan dari file verifikasi Tugas_4_InsertDB.php. Hasil yang ditampilkan
merupakan kesalahan – kesalahan dalam proses posting, yang terdiri dari beberapa kesalahan setelah
ditampun didalam list array.

10. Tugas 4 Form Update Mata Kuliah
Script
<?php
if(!empty($_GET['mk_id'])){
$query = mysqli_query($con, "SELECT * FROM matakuliah WHERE mk_id =
$_GET[mk_id]");
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css"> </head>
<body>
<form action="Tugas4_UpdateDB.php" method="post">
<input type="hidden" name="id" maxlength="30" size="30" value="<?php echo
$_GET['mk_id']; ?>">
<tr>
<th colspan="2">
Ubah Mata Kuliah
</th>
</tr>
<tr>
<td> : <input type="text" name="nama" maxlength="30" size="30" value="<?php echo
$data['mk_nama']; ?>"></td>
</tr>
<tr>
<td> : <input type="text" name="kode" size="30" maxlength="5" value="<?php echo
$data['mk_kode']; ?>"></td>
</tr>
<tr>
<td> : <input type="text" name="dosen" size="30" maxlength="30" value="<?php echo
$data['mk_dosen']; ?>"></td>
</tr>
<tr>
<td colspan="2" align="center"><button type="submit">Ubah</button><button
</tr>
</table>
</form>
</body>
</html>
<?php } ?>

Penjelasan
Memiliki bentuk yang sama dengan form insert, hanya saja, pada apabila ingin mengakses form
update, maka harus ada id atau variabel yang diambil, semisal id yang merupakan variabel tempat
menyimpan data id matakuliah. Variabel ini digunakan untuk menampilkan data yang akan diubah, karena
untuk mengubah data, berarti hanya satu data saja yang dipilih, sehingga data dengan mk_id yang diambil
dengan method GET saja yang bisa diubah pada form update.
Output
Data Blender Animasi diambil dari mk_id = 19.
11. Update DB
Script
<?php
$namaMk = addslashes(strip_tags($_POST['nama']));
$kodeMk = addslashes(strip_tags($_POST['kode']));
$dosenMk = addslashes(strip_tags($_POST['dosen']));
$error;
$counter=0;
$count=1;
function cekNama($namaMk){
global $error;
global $counter;
if(filter_var($namaMk, FILTER_VALIDATE_INT)){
$counter++;
}
}
cekNama($namaMk);
if(empty($namaMk)){
$counter++;
}if(empty($kodeMk)){

$error[] = "Data Kode Mata Kuliah kosong !";
$counter++;
}if(empty($dosenMk)){
$counter++;
}if($counter>0){
include_once "Tugas4_FormUpdate.php";
echo "<center>";
$count++;
echo "</font>";
}
echo "</center>";
}else{
$query = mysqli_query($con, "UPDATE matakuliah SET mk_nama = '$namaMk', mk_kode =
'$kodeMk', mk_dosen = '$dosenMk' WHERE mk_id = '$id'");
echo "<center>";
echo "</font>";
echo "</center>";
}
?>
Penjelasan
Syntax ini merupakan syntax yang digunakan untuk memverifikasi atau syntax yang dilinkan dari
file Tugas_4_FormUpdate.php. Syntax ini berfungsi untuk memastikan inputan yang diinputkan dari form
update telah benar dan dapat diproses di query database.
Output
Sebelumnya, mk_nama untuk nama mata kuliah dari mk_ id = 19, adalah Blender Animasi,
kemudian setelah diubah pada form update, berubah menjadi Animasi Blender.

12. Hapus DB
Script
<?php
$query = mysqli_query($con, "DELETE FROM matakuliah WHERE mk_id = $_GET[mk_id]");
echo "<center>";
echo "Data Berhasil Dihapus";
echo "</font>";
echo "</center>";
}
?>
Penjelasan
HapusDB merupakan file PHP yang digunakan untuk menghapus data tunggal dari tabel
matakuliah yang terdapat pada database bw2db. Penghapusan ini didasarkan pada data mk_id dari salah
satu data pada tabel matakuliah. Mk_d ini diambil dari URL yang telah dikirimkan sebelumnya dengan
menggunakan method GET. Kondisi if(!empty($_GET[‘mk_id’])){ }, merupakan kondisi untuk
memastikan bahwa variabel dari method GET telah terisi dan siap untuk di query.
Output
Sebelum dihapus
Setelah dihapus

Modul 10. PHP dan AJAX dengan JQuery
1. Parsing Data XML dengan PHP
Script Penjelasan
<?php
$i = 1;
if(!$xml = simplexml_load_file('cddata.xml')){
echo "Load XML Failed";
}else{
echo "<h1>Data Gempa</h1>";
foreach($xml as $record){
$title = $record->TITLE;
$artist = $record->ARTIST;
$country = $record->COUNTRY;
$company = $record->COMPANY;
echo "Data ke ".$i."<br />";
echo "Judul : ".$title."<br />";
echo "Artist : ".$artist."<br />";
echo "Negara : ".$country."<br />";
echo "Perusahaan : ".$company."<br />";
echo "<br />";
$i++;
}
}
?>
Script ini digunakan untuk
menampilkan isi dari suatu file XML
pada browser. Browser tidak dapat
begitu saja membaca file XML, namun
file tersebut haruslah di parsing
(diubah) ke dalam jenis file yang dapat
diload oleh browser. Parsing data XML
ke PHP merupakan solusi yang tepat
jika ingin menampilkan data dari file
XML seutuhnya.
Output

2. Post Data dengan AJAX
Script
<html>
<head>
<title>Tambah Mahasiswa</title>
<style type="text/css">
table th{
background-color:#0CF;
color:#000;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:24px;
font-weight:bold;
}
table td{
font-size:16px;
}
button{
background-color:#CCC;
width:100px;
height:30px;
color:#000;
}
button:hover{
border:groove 2px;
}
</style>
<script src="jquery-1.7.2.min.js" type="application/javascript"></script>
<script>
$(document).ready(function() {
$("#save").click(function() {
var nama = $("#nama").val();
var nim = $("#nim").val();
var kelas = $("#kelas").val();
var username = $("#username").val();
var password = $("#password").val();
var repassword = $("#repassword").val();
$.ajax({
type:"POST",
url:"Modul_10_InsertDBAjax.php",
data: "nama=" + nama +"&nim=" + nim +"&kelas=" +
kelas +"&username=" + username +"&password=" + password,
success: function(data) {
$(".info").html(data);
}
})
})

})
</script>
</head>
<body marginwidth="500">
<a href="Modul_10_MenuMahasiswa.php" style="text-decoration:none">Menu Mahasiswa</a>
<tr>
<th colspan="2">
Tambah Mahasiswa
</th>
</tr>
<tr>
<td>Nama</td>
<td> : <input type="text" name="nama" id="nama" maxlength="30" size="30"></td>
</tr>
<tr>
<td>NIM</td>
<td> : <input type="text" name="nim" size="30" id="nim" maxlength="5"></td>
</tr>
<tr>
<td>Kelas</td>
<td> : <input type="text" name="kelas" size="30" id="kelas" maxlength="4"></td>
</tr>
<tr>
<td>Username</td>
<td> : <input type="text" name="username" size="30" id="username"
maxlength="10"></td>
</tr>
<tr>
<td>Password</td>
<td> : <input type="password" name="password" size="30" id="password"
maxlength="30"></td>
</tr>
<tr>
<td colspan="2" align="center"><button type="submit"
id="save">Tambah</button><button type="reset">Batal</button></td>
</tr>
</table>
<div class="info">
</div>
</body>
</html>

Penjelasan
Program di atas merupakan program yang digunakan untuk memposting beberapa inputan yang
kemudian diidentifikasikan ke dalam variabel dalam javascript pada penggunaan Jquery. Class info yang
mendefinisikan tag <div> merupakan tempat yang akan menjadi hasil inputan dengan Jquery. Output
akan tampil jika dan hanya jika kita mengklik button “Tambah”.
Efek baik dari posting dengan menggunakan JQuery, jelas terlihat dari link yang tidak berpindah
ke link lain. Link Modul_10_FormAjax.php tetap berada pada link browser awalnya walaupun url yang
dituju adalah Modul_10_InsertDBAjax.
Secara teknis, output yang dihasilkan dari fungsi JQuery lebih ringan dibanding dengan
menggunakan perpindahan link.
Penjelasan Rinci :
<script>
$("#save").click(function() { //id save adalah id milik button yang akan memproses inputan apabila
button dengan id ini diklik.
var nama = $("#nama").val();//inisialisasi variabel nama
var nim = $("#nim").val();//inisialisasi variabel nim
var kelas = $("#kelas").val();//inisialisasi variabel kelas
var username = $("#username").val();//inisialisasi variabel username
var password = $("#password").val();//inisialisasi variabel password
$.ajax({
type:"POST", //tipe method yang digunakan
url:"Modul_10_InsertDBAjax.php", //link untuk mengotorisasi inputan
data: "nama=" + nama +"&nim=" + nim +"&kelas=" + kelas +"&username=" + username
+"&password=" + password, //nama field diinisialisasi dengan variabel yang telah diinput.
$(".info").html(data);//class info yang merupakan tempat ditampilkannya
}
})
})
})
</script>
Output

3. Latihan 1
Script
<?xml version="1.0" encoding="ISO-8859-1"?>

<CATALOG>
<CD>
<NAMA>Okta Riveranda</NAMA>
<NIM>1257301042</NIM>
<KELAS>1 SI B</KELAS>
</CD>
<CD>
<NAMA>Okta</NAMA>
<NIM>1257301042</NIM>
</CD>
<CD>
<NAMA>Riveranda</NAMA>
<NIM>1257301042</NIM>
</CD>
<CD>
<NAMA>Randa</NAMA>
<NIM>1257301042</NIM>
</CD>
<CD>
<NAMA>Oriv</NAMA>
<NIM>1257301042</NIM>
</CD>
</CATALOG>
Penjelasan
File di atas adalah file XML yang digunakan untuk dijadikan bahan yang akan diparsing ke dalam
bentuk file PHP. File ini terdiri dari Nama, NIM, dan Kelas dari Mahasiswa yang akan diisi secara statis
dan langsung pada file XML-nya.

Output
Tampilan di atas adalah tampilan yang dihasilkan apabila file XML tidak diparsing.

4. Latihan 2
Script
<?php
$i = 1;
if(!$xml = simplexml_load_file('Modul_10_Soal1.xml')){
echo "Load XML Failed";
}else{
echo "<h1>Data Gempa</h1>";
foreach($xml as $record){
$nama = $record->NAMA;
$nim = $record->NIM;
$kelas = $record->KELAS;
echo "Data ke ".$i."<br />";
echo "Nama : ".$nama."<br />";
echo "NIM : ".$nim."<br />";
echo "Kelas : ".$kelas."<br />";
echo "<a href='Modul_10_Soal3FormUpdate.php' style='text-
decoration:none;'>Update</a><br />";
echo "<br />";
$i++;
}
}
?>
<html>
<head>
<title>Data Mahasiswa</title>
</head>
<body>
</body>
</html>
Penjelasan
File di atas adalah file PHP yang merupakan hasil dari parsing file XML pada soal 1.

Output
Tampilan di atas adalah tampilan yang dihasilkan setelah file XML diparsing.

5. Latihan 3a
Script
<html>
<head>
<title>Update Mahasiswa</title>
table th{
color:#000;
font-size:24px;
font-weight:bold;
}
table td{
font-size:16px;
}
button{
width:100px;
height:30px;
color:#000;
}
button:hover{
border:groove 2px;
}
</style>
<script src="jquery-1.7.2.min.js" type="application/javascript"></script>
<script>
$("#updateMhs").click(function() {
var id = $("#id").val();
var nama = $("#nama").val();
var nim = $("#nim").val();
var kelas = $("#kelas").val();
var username = $("#username").val();
var password = $("#password").val();
$.ajax({
type:"POST",
url:"Modul_10_UpdateDB.php",
data: "id=" +id+ "&nama=" + nama +"&nim=" + nim
+"&kelas=" + kelas +"&username=" + username +"&password=" + password,
}
})
})
})
</script>

</head>
<body>
<?php include_once "konek.php";
$mhsid = $_GET['id'];
$query = mysqli_query($con, "SELECT * FROM mahasiswa WHERE id = '$mhsid'");
$m = mysqli_fetch_object($query);
?>
<a href="#">Menu Mahasiswa</a>
<input type="hidden" id="id" value="<?php print $m->id ?>" name="mhsid">
<table>
<tr>
<td>Nama</td>
<td> : <input type="text" name="nama" id="nama"
value="<?php print $m->nama; ?>" width="100%" required></td>
</tr>
<tr>
<td>NIM</td>
<td> : <input type="text" name="nim" id="nim" value="<?php
print $m->nim; ?>" width="100%" required></td>
</tr>
<tr>
<td>Kelas</td>
<td> : <input type="text" name="kelas" id="kelas"
value="<?php print $m->kelas; ?>" width="100%" required></td>
</tr>
<tr>
<td>Username</td>
<td> : <input type="text" name="user" id="username"
value="<?php print $m->username; ?>" width="100%" required></td>
</tr>
<tr>
<td>Password</td>
<td> : <input type="password" name="pass" id="password"
width="100%" required></td>
</tr>
<tr>
<td colspan="2"><input type="submit" id="updateMhs"
value="Save"></td>
</tr>
</table>
<div class="info">
</div>
</body>
</html>
Penjelasan
File di atas adalah file update dari Modul_9_FormUpdate.php yang telah di edit ke dalam file
update yang diintegrasikan dengan fungsi pada JQuery, sehingga lebih ringan dalam pengaksesannya,
secara efektif dan efisien.

Output
6. Latihan 3b
Script
<?php
$id = $_POST['id'];
$nama = $_POST['nama'];
$nim = $_POST['nim'];
$kelas = $_POST['kelas'];
$user = $_POST['username'];
$pass = md5($_POST['password']);
if(!empty($nama) && !empty($nim) && !empty($kelas) && !empty($user) && !empty($pass)){
mysqli_query($con, "UPDATE mahasiswa SET nama = '$nama', nim = '$nim', kelas = '$kelas',
username = '$user', password = '$pass' WHERE id = '$id' ");
echo "<fieldset><legend style='border:solid 1px;'><b>Data berhasil diubah !</b></legend>";
echo "Nama : ".$nama."<br />";
echo "NIM : ".$nim."<br />";
echo "Kelas : ".$kelas."<br />";
echo "Username : ".$user;
echo "</font>";
echo "</fieldset>";
echo "<a href='Modul_10_MenuMahasiswa.php'>Lihat Data</a>";}?>
Penjelasan
File di atas adalah file update dari Modul_9_FormUpdate.php yang telah di edit ke dalam file
update yang diintegrasikan dengan fungsi pada JQuery, sehingga lebih ringan dalam pengaksesannya,
secara efektif dan efisien.

Output
7. Tugas Rumah 1a
Script
<html>
<head>
<title>Tambah Mata Kuliah</title>
table th{
color:#000;
font-size:24px;
font-weight:bold;
}
table td{
font-size:16px;
}
button{
width:100px;
height:30px;
color:#000;
}
button:hover{
border:groove 2px;
}

</style>
<script src="jquery-1.7.2.min.js">
</script>
<script>
$(document).ready(function(){
$("#insert").click(function() {
var nama = $("#nm_mk").val();
var kode = $("#kode_mk").val();
var dosen = $("#dosen_mk").val();
$.ajax({
type:"POST",
url:"Modul_10_TugasInsertDBMK.php",
data: "nama=" + nama + "&kode=" + kode + "&dosen="
+ dosen,
success: function(data){
}
});
});
});
</script>
</head>
<body>
<tr>
<th colspan="2">
Tambah Mata Kuliah
</th>
</tr>
<tr>
<td> : <input type="text" id="nm_mk" name="nama" maxlength="30" size="30"></td>
</tr>
<tr>
<td> : <input type="text" id="kode_mk" name="nim" size="30" maxlength="5"></td>
</tr>
<tr>
<td> : <input type="text" id="dosen_mk" name="kelas" size="30" maxlength="50"></td>
</tr>
<tr>
id="insert">Tambah</button><button type="reset">Batal</button></td>
</tr>
</table>
<div class="info">
</div>
</body>
</html>

Penjelasan
File di atas adalah file yang digunakan untuk membuat suatu form inputan dari tabel matakuliah
pada database bw2db. Form pada file ini adalah form yang telah diintegrasikan dengan fungsi pada
JQuery.
Output
8. Tugas Rumah 1a InsertDB
Script
<?php
include_once "connect.php";
$kode = addslashes(strip_tags($_POST['kode']));
$dosen = addslashes(strip_tags($_POST['dosen']));
$error;
$counter=0;
$count=1;
global $error;
global $counter;
$counter++;
}
}
cekNama($nama);
if(empty($nama)){
$counter++;
}if(empty($kode)){
$error[] = "Data Kode kosong !";
$counter++;
}if(empty($dosen)){

$counter++;
}if($counter>0){
echo "<center>";
$count++;
echo "</font>";
}
echo "</center>";
}else{
$query = mysqli_query($con, "INSERT INTO matakuliah (mk_nama, mk_kode, mk_dosen)
VALUES('$nama', '$kode', '$dosen')");
echo "<center>";
echo "<br />";
echo "<a href='Modul_10_MenuMataKuliah.php' style='text-decoration:none'>Lihat Data Mata
Kuliah</a>";
echo "</font>";
echo "</center>";
}
?>
Penjelasan
Tidak ada yang berubah dari file insert DB, melainkan header yang dihilangkan dan penambahan
pesan, bahwa data telah berhasil diubah. Header dihilangkan supaya pesan tampil tepat di class info, yang
sudah disediakan tempatnya untuk ditampilkan pada file form inputan, sehingga tidak perlu lagi
berpindah halaman dengan header.
Output
Terlihat jelas di bar URL, tidak terjadi perubahan apapun pada link, artinya link tetap berada pada
link dari form insert, dan tampil pesan bahwa data telah ditambahkan dibawah form insert.

9. Tugas Rumah 1b
Script
<?php
$query = mysqli_query($con, "SELECT * FROM matakuliah WHERE mk_id =
$_GET[mk_id]");
?>
<html>
<head>
table th{
color:#000;
font-size:24px;
font-weight:bold;
}
table td{
font-size:16px;
}
button{
width:100px;
height:30px;
color:#000;
}
button:hover{
border:groove 2px;
}
</style>
<script src="jquery-1.7.2.min.js">
</script>
<script>
$(document).ready(function(){
$("#update").click(function() {
var id = $("#id_mk").val();
var nama = $("#nm_mk").val();
var kode = $("#kode_mk").val();
var dosen = $("#dosen_mk").val();
$.ajax({
type:"POST",
url:"Modul_10_TugasUpdateDBMK.php",
data: "id=" + id + "&nama=" + nama + "&kode=" +

kode + "&dosen=" + dosen,
success: function(data){
}
});
});
});
</script>
</head>
<body>
<input type="hidden" id="id_mk" name="id" maxlength="30" size="30" value="<?php
echo $_GET['mk_id']; ?>">
<tr>
<th colspan="2">
Ubah Data Mahasiswa
</th>
</tr>
<tr>
<td> : <input type="text" id="nm_mk" name="nama" maxlength="30" size="30"
value="<?php echo $data['mk_nama']; ?>"></td>
</tr>
<tr>
<td> : <input type="text" id="kode_mk" name="nim" size="30" maxlength="5"
value="<?php echo $data['mk_kode']; ?>"></td>
</tr>
<tr>
<td> : <input type="text" id="dosen_mk" name="kelas" size="30" maxlength="50"
value="<?php echo $data['mk_dosen']; ?>"></td>
</tr>
<tr>
id="update">Ubah</button><button type="reset">Batal</button></td>
</tr>
</table>
<div class="info">
</div>
</body>
</html>
<?php
}
?>
Penjelasan
File di atas adalah file yang digunakan untuk membuat suatu form update dari tabel matakuliah
pada database bw2db. Form pada file ini adalah form yang telah diintegrasikan dengan fungsi pada
JQuery.

Output
10. Tugas Rumah 1b updateDBMK
Script
<?php
$kode = addslashes(strip_tags($_POST['kode']));
$dosen = addslashes(strip_tags($_POST['dosen']));
$error;
$counter=0;
$count=1;
global $error;
global $counter;
$counter++;
}
}
cekNama($nama);
if(empty($nama)){
$counter++;
}if(empty($kode)){
$error[] = "Data Kode kosong !";
$counter++;
}if(empty($dosen)){
$counter++;
}if($counter>0){
echo "<center>";

$count++;
echo "</font>";
}
echo "</center>";
}else{
mysqli_query($con, "UPDATE matakuliah SET mk_nama = '$nama', mk_kode = '$kode', mk_dosen =
'$dosen' WHERE mk_id = '$id'");
echo "<center>";
echo "<br />";
echo "<a href='Modul_10_MenuMataKuliah.php' style='text-decoration:none'>Lihat Data Mata
Kuliah</a>";
echo "</font>";
echo "</center>";
}
?>
Penjelasan
Sebagaimana halny file insertDBMK, file updateDBMK pun tidak mengalami perubahan, selain
header yang dihilangkan yang berfungsi sama dengan fungsi penghilangan header pada file insert DBMK.
Output
Pada file update DBMK, juga tidak terjadi perpindahan antar link, sehingga pesan yang berada
dibawah form update, murni telah disediakan tempatnya melalui class info.

Modul 11. PHP Object Oriented Programming
1. Class Mahasiswa
Script
<?php
class Mahasiswa {
var $nama;
var $nim;
var $kelas;
function setNama($nama) {
$this->nama = $nama;
}
function getNama() {
return $this->nama;
}
function setNim($nim) {
$this->nim = $nim;
}
function getNim() {
return $this->nim;
}
function setKelas($kelas) {
$this->kelas = $kelas;
}
function getKelas() {
return $this->kelas;
}
}
?>
Penjelasan
Pada konsep PBO (Pemrograman Berorientasi Objek), terdapat suatu istilah yang sudah lazim
dikenal oleh para pemrogram PBO. Yaitu, method setter dan method getter. Method setter merupakan
method yang digunakan untuk mengambil nilai untuk kemudian disimpan pada variabel dari class
tersebut. Sedangkan method getter, adalah method yang digunakan untuk mengambil nilai balik dari
variabel class yang sebelumnya telah disimpan melalui method setter.
Output
None

2. Menggunakan Class
Script
<?php
include_once "Modul_11_MahasiswaClass.php";
$mhs1 = new Mahasiswa;
$mhs1->setNama("Okta Riveranda");
$mhs1->setKelas("1 SI B");
$mhs1->setNim("1257301042");
echo "Nama Mahasiswa : ".$mhs1->getNama()."<br />";
echo "NIM Mahasiswa : ".$mhs1->getNim()."<br />";
echo "Kelas Mahasiswa : ".$mhs1->getKelas()."<br />";
?>
Penjelasan
Berbeda halnya dengan Bahasa Pemrograman Java, PHP, apabila akan mengakses suatu class
walaupun berada di paket (folder) yang sama (Java hanya mengimport kelas yang berbeda paket saja).,
maka class tersebut harus di include, lengkap dengan alamt URL.
Pendeklarasian objek hampir sama dengan java ($mhs = new Mahasiswa), perbedaan terdapat
pada nama class untuk mendefinisikan objek. Apabila terdapat constructor ,maka syntax “$mhs = new
Mahasiswa” ditambahkan tanda “()”, sehingga menjadi “$mhs = new Mahasiswa(parameter)”.
Untuk menampilkan variabel dari suatu objek, caranya adalah :
- Inisialisasi dengan method setter. $obj->setterMethod(par);
- Tampilkan dengan fungsi print $obj->getterMethod();
Output

3. Menggunakan Constructor
Script
<?php
include "Modul_11_MahasiswaClass.php";
$con = mysqli_connect("localhost", "root", "", "bw2db") or die("Connection Failed").mysqli_error();
class MahasiswaTampil {
function __construct($id) {
$con = mysqli_connect("localhost", "root", "", "bw2db") or die("Connection
Failed").mysqli_error();
$query = mysqli_query($con, "select * from mahasiswa where id = $id");
$mhs = mysqli_fetch_object($query);
$mahasiswa = new Mahasiswa;
$mahasiswa->setNama($mhs->nama);
$mahasiswa->setNim($mhs->nim);
$mahasiswa->setKelas($mhs->kelas);
$this->nama = $mahasiswa->getNama();
$this->nim = $mahasiswa->getNim();
$this->kelas = $mahasiswa->getKelas();
}
}
$mhs = new MahasiswaTampil(11);
echo "Nama Mahasiswa : ".$mhs->nama."<br />";
echo "NIM Mahasiswa : ".$mhs->nim."<br />";
echo "Kelas Mahasiswa : ".$mhs->kelas."<br />";
echo "<br />=====================<br />";
$mhs->tampilSemua();
?>
Penjelasan
PHP juga memiliki suatu method class yang biasa disebut dengan contructor. Berbeda halnya
dengan pendefinisian constructor pada java, pada PHP cara mendefinisikan constructor adalah dengan
cara : function __constructor() { isi }. Ini $mhs = new MahasiswaTampil(11), merupakan pengaksesan
constructor, jelas terlihat perbedaan antara pendefinisian constructor dengan pengaksesannya. Pada saat
pengaksesan $mhs = new MahasiswaTampil(11), cetak tebal merupakan constructor, sesuai dengan
nama classnya.
Output

4. Latihan 1
Script
<?php
class MataKuliah {
var $nama;
var $kode;
var $dosen;
function setNamaMK($namaMK) {
$this->nama = $namaMK;
}
function setKodeMK($kodeMK) {
$this->kode = $kodeMK;
}
function setDosenMK($dosenMK) {
$this->dosen = $dosenMK;
}
function getNamaMK() {
return $this->nama;
}
function getKodeMK() {
return $this->kode;
}
function getDosenMK() {
return $this->dosen;
}
}
?>
Penjelasan
File di atas adalah file yang digunakan untuk mendefinisikan class matakuliah yang didalamnya
terdapat method setter dan getter untuk tiap variabel di dalam tabel matakuliah.
Output
None

5. Latihan 2
Script
<?php
include "Modul_11_LatihanClassMataKuliah.php";
include_once "../connect.php";
class MKTampil {
function __construct($mk_id) {
$con = mysqli_connect("localhost", "root", "", "bw2db") or die("Connection
Failed").mysqli_error();
$query = mysqli_query($con, "select * from matakuliah where mk_id = $mk_id");
$mk = mysqli_fetch_object($query);
$mataKuliah = new MataKuliah;
$mataKuliah->setNamaMK($mk->mk_nama);
$mataKuliah->setKodeMK($mk->mk_kode);
$mataKuliah->setDosenMK($mk->mk_dosen);
$this->nama = $mataKuliah->getNamaMK();
$this->kode = $mataKuliah->getKodeMK();
$this->dosen = $mataKuliah->getDosenMK();
}
}
$mk = new MKTampil(1);
echo "Nama Mata Kuliah : ".$mk->nama."<br />";
echo "Kode Mata Kuliah : ".$mk->kode."<br />";
echo "Dosen Mata Kuliah : ".$mk->dosen."<br />";
?>
Penjelasan
Pendefinisian konstruktor untuk menampilkan salah satu dari data pada tabel matakuliah yang
berdasarkan pada id yang diinputkan / diinisialisasi sebagai parameter pada constructor.
Output

Laporan praktikum bengkel web dengan PHP

More Related Content

What's hot

Similar to Laporan praktikum bengkel web dengan PHP

Recently uploaded

Laporan praktikum bengkel web dengan PHP