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 "<td align='center' nowrap>";
echo $row['nama'];
echo "</td>";
echo "<td align='center' nowrap>";
echo $row['nim'];
echo "</td>";
echo "<td align='center' nowrap>";
echo $row['kelas'];
echo "</td>";
echo "<td align='center' nowrap>";
echo $row['username'];
echo "</td>";
echo "<td align='center' nowrap>";
?>
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>
<link rel="stylesheet" href="style.css" type="text/css" />
</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
include_once "konek.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
include_once "konek.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>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<form action="Modul_9_UpdateDB.php" method="post">
<input type="hidden" name="id" maxlength="30" size="30" value="<?php echo
$_GET['id']; ?>">
<table align="center">
<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
type="reset">Batal</button></td>
</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
include_once "konek.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']));
$id = addslashes(strip_tags($_POST['id']));
$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_FormUpdate.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{
mysqli_query($con, "UPDATE mahasiswa SET nama = '$nama', nim = '$nim', kelas = '$kelas', username
= '$username', password = '$password' WHERE id = '$id'");
echo "<center>";
echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
echo "Data Berhasil Diubah";
echo "</font>";
echo "</center>";
include_once "Modul_9_MenuMahasiswa.php";
}
?>
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
include_once "konek.php";
if(!empty($_GET['id'])){
$query = mysqli_query($con, "DELETE FROM mahasiswa WHERE id = $_GET[id]");
echo "<center>";
echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
echo "Data Berhasil Dihapus";
echo "</font>";
echo "</center>";
include_once "Modul_9_MenuMahasiswa.php";
}
?>
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
include_once "konek.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 "<td align='center' nowrap>";
echo $i;
echo "</td>";
echo "<td align='center' nowrap>";
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 "<td align='center' nowrap>";
echo $row['mk_kode'];
echo "</td>";
echo "<td align='center' nowrap>";
echo $row['mk_dosen'];
echo "</td>";
echo "<td align='center' nowrap>";
?>
<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">
<table align="center">
<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
type="reset">Batal</button></td>
</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
include_once "konek.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)){
$error[] = "Data nama harus String !";
$counter++;
}
}
cekNama($namaMk);
if(empty($namaMk)){
$error[] = "Data nama kosong !";
$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>";
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 matakuliah (mk_nama, mk_kode, mk_dosen)
VALUES('$namaMk', '$kodeMk', '$dosenMk')");
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 "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
include_once "konek.php";
if(!empty($_GET['mk_id'])){
$query = mysqli_query($con, "SELECT * FROM matakuliah WHERE mk_id =
$_GET[mk_id]");
$data = mysqli_fetch_array($query);
?>
<html>
<head>
<title>Ubah Form</title>
<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']; ?>">
<table align="center">
<tr>
<th colspan="2">
Ubah Mata Kuliah
</th>
</tr>
<tr>
<td>Nama Mata Kuliah</td>
<td> : <input type="text" name="nama" maxlength="30" size="30" value="<?php echo
$data['mk_nama']; ?>"></td>
</tr>
<tr>
<td>Kode Mata Kuliah</td>
<td> : <input type="text" name="kode" size="30" maxlength="5" value="<?php echo
$data['mk_kode']; ?>"></td>
</tr>
<tr>
<td>Dosen Pengampu</td>
<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
type="reset">Batal</button></td>
</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
include_once "konek.php";
$namaMk = addslashes(strip_tags($_POST['nama']));
$kodeMk = addslashes(strip_tags($_POST['kode']));
$dosenMk = addslashes(strip_tags($_POST['dosen']));
$id = addslashes(strip_tags($_POST['id']));
$error;
$counter=0;
$count=1;
function cekNama($namaMk){
global $error;
global $counter;
if(filter_var($namaMk, FILTER_VALIDATE_INT)){
$error[] = "Data nama harus String !";
$counter++;
}
}
cekNama($namaMk);
if(empty($namaMk)){
$error[] = "Data nama kosong !";
$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_FormUpdate.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, "UPDATE matakuliah SET mk_nama = '$namaMk', mk_kode =
'$kodeMk', mk_dosen = '$dosenMk' WHERE mk_id = '$id'");
echo "<center>";
echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
echo "Data Berhasil Diubah";
echo "</font>";
echo "</center>";
include_once "Tugas4_MenuMataKuliah.php";
}
?>
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
include_once "konek.php";
if(!empty($_GET['mk_id'])){
$query = mysqli_query($con, "DELETE FROM matakuliah WHERE mk_id = $_GET[mk_id]");
echo "<center>";
echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
echo "Data Berhasil Dihapus";
echo "</font>";
echo "</center>";
include_once "Tugas4_MenuMataKuliah.php";
}
?>
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-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
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>
<table align="center">
<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>
$(document).ready(function() {
$("#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.
success: function(data) {
$(".info").html(data);//class info yang merupakan tempat ditampilkannya
}
})
})
})
</script>
Output
3. Latihan 1
Script
<?xml version="1.0" encoding="ISO-8859-1"?>
<!-- Edited by XMLSpy® -->
<CATALOG>
<CD>
<NAMA>Okta Riveranda</NAMA>
<NIM>1257301042</NIM>
<KELAS>1 SI B</KELAS>
</CD>
<CD>
<NAMA>Okta</NAMA>
<NIM>1257301042</NIM>
<KELAS>1 SI B</KELAS>
</CD>
<CD>
<NAMA>Riveranda</NAMA>
<NIM>1257301042</NIM>
<KELAS>1 SI B</KELAS>
</CD>
<CD>
<NAMA>Randa</NAMA>
<NIM>1257301042</NIM>
<KELAS>1 SI B</KELAS>
</CD>
<CD>
<NAMA>Oriv</NAMA>
<NIM>1257301042</NIM>
<KELAS>1 SI B</KELAS>
</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>
<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-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
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() {
$("#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,
success: function(data) {
$(".info").html(data);
}
})
})
})
</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
include_once "konek.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 "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
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>
<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-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
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">
</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){
$(".info").html(data);
}
});
});
});
</script>
</head>
<body>
<table align="center">
<tr>
<th colspan="2">
Tambah Mata Kuliah
</th>
</tr>
<tr>
<td>Nama Mata Kuliah</td>
<td> : <input type="text" id="nm_mk" name="nama" maxlength="30" size="30"></td>
</tr>
<tr>
<td>Kode Mata Kuliah</td>
<td> : <input type="text" id="kode_mk" name="nim" size="30" maxlength="5"></td>
</tr>
<tr>
<td>Dosen Pengampu</td>
<td> : <input type="text" id="dosen_mk" name="kelas" size="30" maxlength="50"></td>
</tr>
<tr>
<td colspan="2" align="center"><button type="submit"
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";
$nama = addslashes(strip_tags($_POST['nama']));
$kode = addslashes(strip_tags($_POST['kode']));
$dosen = addslashes(strip_tags($_POST['dosen']));
$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++;
}
}
cekNama($nama);
if(empty($nama)){
$error[] = "Data nama kosong !";
$counter++;
}if(empty($kode)){
$error[] = "Data Kode kosong !";
$counter++;
}if(empty($dosen)){
$error[] = "Data Dosen kosong !";
$counter++;
}if($counter>0){
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 matakuliah (mk_nama, mk_kode, mk_dosen)
VALUES('$nama', '$kode', '$dosen')");
echo "<center>";
echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
echo "Data Berhasil Ditambahkan";
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
include_once "connect.php";
if(!empty($_GET['mk_id'])){
$query = mysqli_query($con, "SELECT * FROM matakuliah WHERE mk_id =
$_GET[mk_id]");
$data = mysqli_fetch_array($query);
?>
<html>
<head>
<title>Ubah Form</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-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
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">
</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){
$(".info").html(data);
}
});
});
});
</script>
</head>
<body>
<input type="hidden" id="id_mk" name="id" maxlength="30" size="30" value="<?php
echo $_GET['mk_id']; ?>">
<table align="center">
<tr>
<th colspan="2">
Ubah Data Mahasiswa
</th>
</tr>
<tr>
<td>Nama Mata Kuliah</td>
<td> : <input type="text" id="nm_mk" name="nama" maxlength="30" size="30"
value="<?php echo $data['mk_nama']; ?>"></td>
</tr>
<tr>
<td>Kode Mata Kuliah</td>
<td> : <input type="text" id="kode_mk" name="nim" size="30" maxlength="5"
value="<?php echo $data['mk_kode']; ?>"></td>
</tr>
<tr>
<td>Dosen Pengampu</td>
<td> : <input type="text" id="dosen_mk" name="kelas" size="30" maxlength="50"
value="<?php echo $data['mk_dosen']; ?>"></td>
</tr>
<tr>
<td colspan="2" align="center"><button type="submit"
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
include_once "connect.php";
$nama = addslashes(strip_tags($_POST['nama']));
$kode = addslashes(strip_tags($_POST['kode']));
$dosen = addslashes(strip_tags($_POST['dosen']));
$id = addslashes(strip_tags($_POST['id']));
$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++;
}
}
cekNama($nama);
if(empty($nama)){
$error[] = "Data nama kosong !";
$counter++;
}if(empty($kode)){
$error[] = "Data Kode kosong !";
$counter++;
}if(empty($dosen)){
$error[] = "Data Dosen kosong !";
$counter++;
}if($counter>0){
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{
mysqli_query($con, "UPDATE matakuliah SET mk_nama = '$nama', mk_kode = '$kode', mk_dosen =
'$dosen' WHERE mk_id = '$id'");
echo "<center>";
echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
echo "Data Berhasil Diubah";
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

  • 1.
    LAPORAN PRAKTIKUM BENGKEL WEB2 MODUL 9 – MODUL 11 OKTA RIVERANDA 1257301042 PANDU HARRIEN FITRA 1257301043
  • 2.
    Modul 9. PHPdan 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 "<td align='center' nowrap>"; echo $row['nama']; echo "</td>"; echo "<td align='center' nowrap>"; echo $row['nim']; echo "</td>"; echo "<td align='center' nowrap>"; echo $row['kelas']; echo "</td>"; echo "<td align='center' nowrap>"; echo $row['username']; echo "</td>"; echo "<td align='center' nowrap>"; ?> 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.
  • 3.
    <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
  • 4.
    2. Form InsertMahasiswa Script <html> <head> <title>Tambah Mahasiswa</title> <link rel="stylesheet" href="style.css" type="text/css" /> </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>
  • 5.
    Penjelasan Program di atasadalah 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 include_once "konek.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++;
  • 6.
    } } cekNama($nama); cekNim($nim); if(empty($nama)){ $error[] = "Datanama 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"; } ?>
  • 7.
    Penjelasan Pada file initerdapat : - 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.
  • 8.
    4. Form UpdateMahasiswa Script <?php include_once "konek.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> <link rel="stylesheet" href="style.css" type="text/css" /> </head> <body> <form action="Modul_9_UpdateDB.php" method="post"> <input type="hidden" name="id" maxlength="30" size="30" value="<?php echo $_GET['id']; ?>"> <table align="center"> <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>
  • 9.
    </tr> <tr> <td>re-Password</td> <td> : <inputtype="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 type="reset">Batal</button></td> </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.
  • 10.
    5. Update DB Script <?php include_once"konek.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'])); $id = addslashes(strip_tags($_POST['id'])); $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)){
  • 11.
    $error[] = "Datapassword 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>"; 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{ mysqli_query($con, "UPDATE mahasiswa SET nama = '$nama', nim = '$nim', kelas = '$kelas', username = '$username', password = '$password' WHERE id = '$id'"); echo "<center>"; echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>"; echo "Data Berhasil Diubah"; echo "</font>"; echo "</center>"; include_once "Modul_9_MenuMahasiswa.php"; } ?> 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.
  • 12.
    Output Sebelumnya, username dariid = 1, adalah ujang, kemudian setelah diubah pada form update, berubah menjadi UJANG. 6. Hapus DB Script <?php include_once "konek.php"; if(!empty($_GET['id'])){ $query = mysqli_query($con, "DELETE FROM mahasiswa WHERE id = $_GET[id]"); echo "<center>"; echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>"; echo "Data Berhasil Dihapus"; echo "</font>"; echo "</center>"; include_once "Modul_9_MenuMahasiswa.php"; } ?> 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.
  • 13.
    Output Sebelum dihapus Setelahdihapus 7. Tugas 4 Menu Mata Kuliah Script Penjelasan <?php include_once "konek.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 "<td align='center' nowrap>"; echo $i; echo "</td>"; echo "<td align='center' nowrap>"; 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.
  • 14.
    echo "</td>"; echo "<tdalign='center' nowrap>"; echo $row['mk_kode']; echo "</td>"; echo "<td align='center' nowrap>"; echo $row['mk_dosen']; echo "</td>"; echo "<td align='center' nowrap>"; ?> <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
  • 15.
    8. Tugas 4Form 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"> <table align="center"> <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 type="reset">Batal</button></td> </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
  • 16.
    9. Tugas 4File verifikasi InsertDB Script <?php include_once "konek.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)){ $error[] = "Data nama harus String !"; $counter++; } } cekNama($namaMk); if(empty($namaMk)){ $error[] = "Data nama kosong !"; $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>"; 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 matakuliah (mk_nama, mk_kode, mk_dosen) VALUES('$namaMk', '$kodeMk', '$dosenMk')"); echo "<center>"; echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>";
  • 17.
    echo "Data BerhasilDitambahkan"; 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.
  • 18.
    10. Tugas 4Form Update Mata Kuliah Script <?php include_once "konek.php"; if(!empty($_GET['mk_id'])){ $query = mysqli_query($con, "SELECT * FROM matakuliah WHERE mk_id = $_GET[mk_id]"); $data = mysqli_fetch_array($query); ?> <html> <head> <title>Ubah Form</title> <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']; ?>"> <table align="center"> <tr> <th colspan="2"> Ubah Mata Kuliah </th> </tr> <tr> <td>Nama Mata Kuliah</td> <td> : <input type="text" name="nama" maxlength="30" size="30" value="<?php echo $data['mk_nama']; ?>"></td> </tr> <tr> <td>Kode Mata Kuliah</td> <td> : <input type="text" name="kode" size="30" maxlength="5" value="<?php echo $data['mk_kode']; ?>"></td> </tr> <tr> <td>Dosen Pengampu</td> <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 type="reset">Batal</button></td> </tr> </table> </form> </body> </html> <?php } ?>
  • 19.
    Penjelasan Memiliki bentuk yangsama 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 include_once "konek.php"; $namaMk = addslashes(strip_tags($_POST['nama'])); $kodeMk = addslashes(strip_tags($_POST['kode'])); $dosenMk = addslashes(strip_tags($_POST['dosen'])); $id = addslashes(strip_tags($_POST['id'])); $error; $counter=0; $count=1; function cekNama($namaMk){ global $error; global $counter; if(filter_var($namaMk, FILTER_VALIDATE_INT)){ $error[] = "Data nama harus String !"; $counter++; } } cekNama($namaMk); if(empty($namaMk)){ $error[] = "Data nama kosong !"; $counter++; }if(empty($kodeMk)){
  • 20.
    $error[] = "DataKode Mata Kuliah kosong !"; $counter++; }if(empty($dosenMk)){ $error[] = "Data Dosen kosong !"; $counter++; }if($counter>0){ include_once "Tugas4_FormUpdate.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, "UPDATE matakuliah SET mk_nama = '$namaMk', mk_kode = '$kodeMk', mk_dosen = '$dosenMk' WHERE mk_id = '$id'"); echo "<center>"; echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>"; echo "Data Berhasil Diubah"; echo "</font>"; echo "</center>"; include_once "Tugas4_MenuMataKuliah.php"; } ?> 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.
  • 21.
    12. Hapus DB Script <?php include_once"konek.php"; if(!empty($_GET['mk_id'])){ $query = mysqli_query($con, "DELETE FROM matakuliah WHERE mk_id = $_GET[mk_id]"); echo "<center>"; echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>"; echo "Data Berhasil Dihapus"; echo "</font>"; echo "</center>"; include_once "Tugas4_MenuMataKuliah.php"; } ?> 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
  • 22.
    Modul 10. PHPdan 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
  • 23.
    2. Post Datadengan 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-family:"Trebuchet MS", Arial, Helvetica, sans-serif; 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); } }) })
  • 24.
    }) </script> </head> <body marginwidth="500"> <a href="Modul_10_MenuMahasiswa.php"style="text-decoration:none">Menu Mahasiswa</a> <table align="center"> <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>
  • 25.
    Penjelasan Program di atasmerupakan 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> $(document).ready(function() { $("#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. success: function(data) { $(".info").html(data);//class info yang merupakan tempat ditampilkannya } }) }) }) </script> Output
  • 26.
    3. Latihan 1 Script <?xmlversion="1.0" encoding="ISO-8859-1"?> <!-- Edited by XMLSpy® --> <CATALOG> <CD> <NAMA>Okta Riveranda</NAMA> <NIM>1257301042</NIM> <KELAS>1 SI B</KELAS> </CD> <CD> <NAMA>Okta</NAMA> <NIM>1257301042</NIM> <KELAS>1 SI B</KELAS> </CD> <CD> <NAMA>Riveranda</NAMA> <NIM>1257301042</NIM> <KELAS>1 SI B</KELAS> </CD> <CD> <NAMA>Randa</NAMA> <NIM>1257301042</NIM> <KELAS>1 SI B</KELAS> </CD> <CD> <NAMA>Oriv</NAMA> <NIM>1257301042</NIM> <KELAS>1 SI B</KELAS> </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.
  • 27.
    Output Tampilan di atasadalah tampilan yang dihasilkan apabila file XML tidak diparsing.
  • 28.
    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.
  • 29.
    Output Tampilan di atasadalah tampilan yang dihasilkan setelah file XML diparsing.
  • 30.
    5. Latihan 3a Script <html> <head> <title>UpdateMahasiswa</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-family:"Trebuchet MS", Arial, Helvetica, sans-serif; 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() { $("#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, success: function(data) { $(".info").html(data); } }) }) }) </script>
  • 31.
    </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.
  • 32.
    Output 6. Latihan 3b Script <?php include_once"konek.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 "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>"; 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.
  • 33.
    Output 7. Tugas Rumah1a Script <html> <head> <title>Tambah Mata Kuliah</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-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:16px; } button{ background-color:#CCC; width:100px; height:30px; color:#000; } button:hover{ border:groove 2px; }
  • 34.
    </style> <script src="jquery-1.7.2.min.js"> </script> <script> $(document).ready(function(){ $("#insert").click(function() { varnama = $("#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){ $(".info").html(data); } }); }); }); </script> </head> <body> <table align="center"> <tr> <th colspan="2"> Tambah Mata Kuliah </th> </tr> <tr> <td>Nama Mata Kuliah</td> <td> : <input type="text" id="nm_mk" name="nama" maxlength="30" size="30"></td> </tr> <tr> <td>Kode Mata Kuliah</td> <td> : <input type="text" id="kode_mk" name="nim" size="30" maxlength="5"></td> </tr> <tr> <td>Dosen Pengampu</td> <td> : <input type="text" id="dosen_mk" name="kelas" size="30" maxlength="50"></td> </tr> <tr> <td colspan="2" align="center"><button type="submit" id="insert">Tambah</button><button type="reset">Batal</button></td> </tr> </table> <div class="info"> </div> </body> </html>
  • 35.
    Penjelasan File di atasadalah 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"; $nama = addslashes(strip_tags($_POST['nama'])); $kode = addslashes(strip_tags($_POST['kode'])); $dosen = addslashes(strip_tags($_POST['dosen'])); $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++; } } cekNama($nama); if(empty($nama)){ $error[] = "Data nama kosong !"; $counter++; }if(empty($kode)){ $error[] = "Data Kode kosong !"; $counter++; }if(empty($dosen)){ $error[] = "Data Dosen kosong !";
  • 36.
    $counter++; }if($counter>0){ echo "<center>"; echo "<b>KesalahanInput : <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 matakuliah (mk_nama, mk_kode, mk_dosen) VALUES('$nama', '$kode', '$dosen')"); echo "<center>"; echo "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>"; echo "Data Berhasil Ditambahkan"; 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.
  • 37.
    9. Tugas Rumah1b Script <?php include_once "connect.php"; if(!empty($_GET['mk_id'])){ $query = mysqli_query($con, "SELECT * FROM matakuliah WHERE mk_id = $_GET[mk_id]"); $data = mysqli_fetch_array($query); ?> <html> <head> <title>Ubah Form</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-family:"Trebuchet MS", Arial, Helvetica, sans-serif; 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"> </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=" +
  • 38.
    kode + "&dosen="+ dosen, success: function(data){ $(".info").html(data); } }); }); }); </script> </head> <body> <input type="hidden" id="id_mk" name="id" maxlength="30" size="30" value="<?php echo $_GET['mk_id']; ?>"> <table align="center"> <tr> <th colspan="2"> Ubah Data Mahasiswa </th> </tr> <tr> <td>Nama Mata Kuliah</td> <td> : <input type="text" id="nm_mk" name="nama" maxlength="30" size="30" value="<?php echo $data['mk_nama']; ?>"></td> </tr> <tr> <td>Kode Mata Kuliah</td> <td> : <input type="text" id="kode_mk" name="nim" size="30" maxlength="5" value="<?php echo $data['mk_kode']; ?>"></td> </tr> <tr> <td>Dosen Pengampu</td> <td> : <input type="text" id="dosen_mk" name="kelas" size="30" maxlength="50" value="<?php echo $data['mk_dosen']; ?>"></td> </tr> <tr> <td colspan="2" align="center"><button type="submit" 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.
  • 39.
    Output 10. Tugas Rumah1b updateDBMK Script <?php include_once "connect.php"; $nama = addslashes(strip_tags($_POST['nama'])); $kode = addslashes(strip_tags($_POST['kode'])); $dosen = addslashes(strip_tags($_POST['dosen'])); $id = addslashes(strip_tags($_POST['id'])); $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++; } } cekNama($nama); if(empty($nama)){ $error[] = "Data nama kosong !"; $counter++; }if(empty($kode)){ $error[] = "Data Kode kosong !"; $counter++; }if(empty($dosen)){ $error[] = "Data Dosen kosong !"; $counter++; }if($counter>0){ echo "<center>"; echo "<b>Kesalahan Input : <br /></b>";
  • 40.
    foreach($error as $tampil){ echo"<font color='#FF0000' size='+1'>"; echo $count.". ".$tampil."<br />"; $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 "<font color='#000000' face='Trebuchet MS, Arial, Helvetica, sans-serif' size='+1'>"; echo "Data Berhasil Diubah"; 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.
  • 41.
    Modul 11. PHPObject 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
  • 42.
    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
  • 43.
    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
  • 44.
    4. Latihan 1 Script <?php classMataKuliah { 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
  • 45.
    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