Sirajuddin Abraham - 1410651185 - Membuat Aplikasi PHP CRUD SQL
CRUD KRS Online menggunakan framework MetroUI
-
Upload
muhammad-lundy-alfandiarto -
Category
Documents
-
view
323 -
download
11
description
Transcript of CRUD KRS Online menggunakan framework MetroUI
Pemrograman Berbasis Web
Pemrograman Berbasis Web
TUGAS 5
PEMOGRAMAN BERBASIS WEB
CRUD “KRS ONLINE”
Disusun oleh:
(Muhamad Lundy Alfandiarto)
(1210651002)
JURUSAN TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS MUHAMMADIYAH JEMBER
2013
Pemrograman Berbasis Web
Pemrograman Berbasis Web
1. Tujuan
Memahami konsep dasar MetroUI dan penggunaannya sebagai templating pada website
2. Teori
Tampilan user interface dari operating system windows 8 dan 8.1 yang mengusung
desain kotak-kotak yang simple ternyata banyak disukai pengguna windows diseluruh
dunia. Oleh sebab itu, Sergey Vimenov yang berkebangsaan Ukraine beserta timnya
membuat framework terbaru, namanya Metro UI CSS.
Metro UI memiliki gaya khas kotak-kotak yang tidak memiliki border-radius dan
embel-embel box-shadow yang sedikit namun bisa dikatakan tampilannya mirip bootstrap
namun tak serupa.
Berbeda dengan bootstrap, Metro UI memiliki lebih banyak padding pada bagian
konten ketimbang pada komponen itu sendiri hingga tak salah semua orang bisa
membuatnya tanpa menggunakan framework.
Ada beberapa kelebihan dan kekurangan yang harus kalian ketahui jika menggunakan
Framework ini :
Kelebihan
1. Font yang digunakan adalah Segoe-UI termasuk heading hingga normal style.
2. Plugins yang disediakan cukup banyak.
3. Terdapat global style yang biasanya digunakan untuk CSS Default pada setiap
component.
4. Responsive template
Kekurangan
1. Penggunaan plugins diluar Metro juga akan membuat semua plugins yang
terpasang tidak dapat berfungsi.
2. Pemasangan plugins metro juga tergolong rumit.
3. Jika ingin menggunakan tampilan metro maka pada setiap bodynya akan
dipasang class=”metro”
4. Struktur HTML yang terlalu banyak
5. Sering terjadinya konflik antara Framework Metro UI dengan Tampilan website
default.
Pemrograman Berbasis Web
Pemrograman Berbasis Web
3. Tugas
1. Buatlah sebuah aplikasi CRUD dengan PHP tentang mahasiswa, mata kuliah, dan KRS.
2. Form tampilan menggunakan Metro UI.
ALUR PROGRAM:
1. Mahasiswa harus login terlebih dahulu
2. Setelah sukses login, mahasiswa akan berada pada tampilan home SIA. Terdapat tiga
button KRS Mahasiswa untuk melihat KRS , Detail Mahasiswa untuk melihat dan edit
informasi tentang mahasiswa dan LOG OUT untuk keluar dari SIA
Pemrograman Berbasis Web
Pemrograman Berbasis Web
3. Jika ingin mengedit identitas mahasiswa, maka user harus klik button Detail Mahasiswa.
Kemudian ganti data yang salah, misalnya nama
Kemudian klik button UPDATE maka data akan berubah seperti ini:
Pemrograman Berbasis Web
Pemrograman Berbasis Web
4. Button KRS Mahasiswa untuk melihat Kartu Rencana Studi, karena mahasiswa belum
mengambil mata kuliah , tampilannya masih kosong seperti ini:
Jika ingin mengambil mata kuliah, mahasiswa(user) harus klik link AMBIL MK, dan jika
ingin log out maka klik link LOG OUT.
Berikut tampilan saat memilih atau mengambil mata kuliah:
Jadwal diatas hanya sebagian karena hanya sebagai contoh. Pada tiap-tiap baris mata kuliah
terdapat link AMBIL untuk mengambil mata kuliah sesuai baris yang di klik. Kemudian ada
link LOGOUT untuk keluar dari SIA
Pemrograman Berbasis Web
Pemrograman Berbasis Web
5. Ketika link AMBIL di klik maka akan muncul tampilan KRS dan jadwal yang diambil.
Jika ingin mengambil mata kuliah lagi, klik link AMBIL MK dan ambil mata kuliah yang
ingin diambil
Pemrograman Berbasis Web
Pemrograman Berbasis Web
Jika mahasiswa(user) ingin menghapus mata kuliah, klik link DELETE pada baris MK yang
ingin dihapus, maka data akan terhapus.
Jika selesai mengambil mata kuliah mahasiswa (user) bisa keluar dari program dengan klik
link LOGOUT
Pada proses AMBIL MK, data mata kuliah dan mahasiswa yang mengambil MK tersebut
akan disimpan pada table krs di database seperti berikut:
TUTORIAL:
1. Buat database dengan nama krs terlebih dahulu dengan query dibawah ini:
create database krs;
2. Buat table mhs untuk menyimpan data mahasiswa, matakuliah untuk menyimpan data
mata kuliah, dan table krs untuk menyimpan data mahasiswa dan mata kuliah yang
diambilnya
create table mhs(
nim varchar(12),
password varchar(12),
nama_mhs varchar(35),
semester int(1),
jurusan varchar(30),
alamat varchar(45),
tanggal_lahir date,
primary key (nim)
);
Pemrograman Berbasis Web
Pemrograman Berbasis Web
create table matakuliah(
kode_mk varchar(6),
nama_mk varchar(30),
semester int(1),
sks int(2),
dosen varchar(45),
kelas varchar(5),
jam time,
primary key (kode_mk)
);
create table krs(
kode_mk varchar(6),
nama_mk varchar(30),
semester int(1),
sks int(2),
dosen varchar(45),
kelas varchar(5),
jam time,
status varchar(10),
nim varchar(12),
nama_mhs varchar(35),
primary key (kode_mk)
);
3. Isi table mhs dan matakuliah
Table mhs (sebagai user)
Table matakuliah (sebagai jadwal matakuliah)
Pemrograman Berbasis Web
Pemrograman Berbasis Web
4. Masuk pada bagian designer untuk menghubungkan atribut
Hubungkan primary key(nim) yang ada di table mhs dengan foreign key(nim) yang ada
di table krs dan hubungkan primary key(kode_mk) di table matakuliah dengan
primary key(kode_mk) pada table krs seperti berikut:
5. Buat file koneksi.php untuk menghubungkan file php dengan database yang sudah dibuat
<?php
//tiga parameter sebagai acuan
$servername = "localhost";
$username = "root";
$password = "";
$databasename = "KRS";//nama database
//membuat koneksi ke mysql dengan tiga parameter
$db = mysql_connect("$servername", "$username", "$password")
or die
("I cannot connect to the database because : " . mysql_error());
//memanggil nama databasenya
mysql_select_db("$databasename", $db)
or die
("I cannot select the database '$databasename' because : " . mysql_error());
?>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
6. Buat form untuk login dengan nama form.php, berikut source codenya:
<html>
<head><title>LOGIN</title>
<!—- code untuk memanggil framework MetroUI -->
<link rel="stylesheet" href="css/metro-bootstrap.css">
<script src="js/jquery/jquery.min.js"></script>
<script src="js/jquery/jquery.widget.min.js"></script>
<script src="js/metro/metro.min.js"></script>
</head>
<body bgcolor="#32425C">
<!—- code untuk tampilan header dengan CSS inline -->
<div style="background-color:#008287;position:fixed;top:0;width:100%; height:65px;">
<header style="position:fixed;top:0;width:100%;height:60px;background-color:#32353A
;">
<!—- tulisan pada bagian header dengan CSS inline -->
<p style="color:white;font:20px segoe ui;text-align:center;">UNIVERSITAS MUHAMMADIYAH
JEMBER</p>
</header>
</div>
<!—- pemanggilan class metro supaya tampilan form menjadi metro(kotak2) -->
<form class="metro" method="post">
<!—- tampilan judul dengan CSS inline -->
<div style="margin:auto;padding:10px;background-color:#008287;width:35%;">
<h1 align="center" style="padding-top:150px; color:white;">Sistem Informasi
Akademik</h1></br>
</div>
<table style="background-color:#EEEEEE; width:35%; height:22%;" align="center" >
<tr> <!—- inputfield untuk NIM dan pemanggilan class input pada MetroUI -->
<td align="center"><input class="input-control text" style="width:55%;"
type="text" name="username" placeholder="NIM"></td>
</tr>
<tr> <!—- inputfield untuk Password dan pemanggilan class input pada MetroUI -->
<td align="center" ><input class="input-control password" style="width:55%"
type="password" name="password" placeholder="Password"></td>
</tr>
<tr> <!—- button dengan pemanggilan class button MetroUI -->
<td align="center" ><input class="default && large" type="submit"
name="submit" value="SIGN IN"></td>
</tr>
</table>
</form>
<?php //kondisi jika button submit diklik
if(isset($_POST['submit'])){
$nim=$_POST['username']; //mendapakan nilai dari inputfield
$pass=$_POST['password']; /mendapatkan nilai dari inputfield
//link menuju file home.php dengan nim dan password = nilai yang di inputkan
echo "<script>window.location.href='home.php?nim=$nim && password=$pass'</script>";
}
?>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
<!—- tampilan footer dengan CSS inline -->
<div style="background-color:#008287;position:fixed;bottom:0;width:100%;height:65px;">
<footer style="position:fixed;bottom:0;width:100%;height:60px;background-color:
#232A2B;">
<!—- tulisan dibagian footer dengan CSS inline -->
<p style="color:white; font: 16px segoe ui; text-align:center;">Powered by UPT -
Pusat Data dan Informasi</p>
</footer>
</div>
</body>
</html>
7. Kemudian buat file php untuk tampilan home dengan nama home.php , berikut source codenya <?php //kondisi jika nim dan password sesuai dengan data pada database mhs
include "koneksi.php"; //memanggil isi file koneksi.php dengan keyword include
$username=$_GET['nim']; //mengambil nilai nim dari URL
$password=$_GET['password']; //mengambil nilai password dari URL
//memilih data berdasarkan nim dan password yang didapat dari URL
$query=mysql_query("select *from mhs where nim='$username' and password='$password'");
$cek=mysql_num_rows($query); //mengecek ketersedian data
$row=mysql_fetch_assoc($query); //menyimpan data dalam bentuk assoc supaya efisien
if($cek){ //kondisi jika variable cek benar(data ada)
echo "Anda berhasil login"; //muncul pemberitahuan
}else{ //jika tidak data tidak ada
//akan dikembalikan ke tampilan form login
echo "<script>window.location.href='form.php';</script>";
}
?>
<html>
<head>
<title>HOME</title>
<!—- code untuk memanggil framework MetroUI -->
<link rel="stylesheet" href="css/metro-bootstrap.css">
<script src="js/jquery/jquery.min.js"></script>
<script src="js/jquery/jquery.widget.min.js"></script>
<script src="js/metro/metro.min.js"></script>
</head>
<body bgcolor="#32425C">
<!—- code untuk tampilan header dengan CSS inline -->
<div style="background-color:#008287;position:fixed;top:0;width:100%;height:65px;">
<header style="position:fixed;top:0;width:100%;height:60px;background-color:
#32353A;">
<!—- tulisan pada bagian header dengan CSS inline -->
<p style="color:white;font:20px segoe ui;text-align:center;">Sistem Informasi
Akademik - UNIVERSITAS MUHAMMADIYAH JEMBER </p>
<div class="metro" align="right"> <!—- button logout untuk keluar dr SIA -->
<button onclick="window.location='form.php'" class="default && small">LOG
OUT</button>
</div>
</header>
</div>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
<!—- pemanggilan class metro supaya tampilan form menjadi metro(kotak2) -->
<form class="metro" method="post">
<!—- tampilan judul form dengan CSS inline -->
<div style="margin:auto; padding:10px; background-color:#008287; width:35%;">
<h1 align="center" style="padding-top:150px; color:white;">Selamat
Datang</h1>
</div>
<!—- table untuk menampilkan detail mahasiswa dengan CSS inline -->
<table style="background-color:#EEEEEE; width:35%; height:32%;" align="center" >
<tr>
<td align="right" bgcolor="#DCDCDC">NIM</td>
<td bgcolor="#DCDCDC" align="center" >:</td>
<!—- memanggil data pada database dengan variable $row diikuti atributnya -->
<td width="65%"><?php echo $row['nim'];?></td>
</tr>
<tr>
<td align="right" bgcolor="#DCDCDC">Nama</td>
<td bgcolor="#DCDCDC" align="center" >:</td>
<!—- memanggil data pada database dengan variable $row diikuti atributnya -->
<td width="65%"><?php echo $row['nama_mhs'];?></td>
</tr>
<tr>
<td align="right" bgcolor="#DCDCDC">Alamat</td>
<td bgcolor="#DCDCDC" align="center" >:</td>
<!—- memanggil data pada database dengan variable $row diikuti atributnya -->
<td width="65%"><?php echo $row['alamat'];?></td>
</tr>
<tr>
<td align="right" bgcolor="#DCDCDC">Tanggal Lahir</td>
<td bgcolor="#DCDCDC" align="center" >:</td>
<!—- memanggil data pada database dengan variable $row diikuti atributnya -->
<td width="65%"><?php echo $row['tanggal_lahir'];?></td>
</tr>
<tr>
<td align="right" bgcolor="#DCDCDC">Jurusan</td>
<td bgcolor="#DCDCDC" align="center" >:</td>
<!—- memanggil data pada database dengan variable $row diikuti atributnya -->
<td width="65%"><?php echo $row['jurusan'];?></td>
</tr>
</table>
<!—- table untuk button dengan CSS inline -->
<table style="background-color:#EEEEEE;" align="center" border="0" cellspacing="0"
cellpadding="0">
<tr align="center">
<!—- button KRS Mahasiswa dengan class metroUI -->
<td><input class="default && large" type="submit" name="submit" value="KRS
Mahasiswa"></td>
<td> </td>
<!—- button Detail Mahasiswa dengan class metroUI -->
<td><input class="default && large" type="submit" name="update" value="Detail
Mahasiswa"></td>
</tr>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
</table>
</form>
<?php //membuat kondisi untuk button
if(isset($_POST['submit'])){ //kondisi untuk button dengan name=submit
//link menuju file krs.php dengan nim = nilai yg didapat dr URL
echo "<script>window.location.href='krs.php?nim=$username'</script>";
}
if(isset($_POST['update'])){ //kondisi untuk button dengan name=update
//link menuju file update.php dengan nim = nilai yg didapat dr URL
echo"<script>window.location.href='update.php?nim=$username'</script>";
}
?>
<!—- tampilan footer dengan CSS inline -->
<div style="background-color:#008287;position:fixed;bottom:0;width:100%; height:65px;
">
<footer style="position:fixed;bottom:0;width:100%;height:60px;background-color:
#232A2B;">
<!—- tulisan dibagian footer dengan CSS inline -->
<p style="color:white; font: 16px segoe ui; text-align:center;">Powered by UPT -
Pusat Data dan Informasi</p>
</footer>
</div>
</body>
</html>
8. Buat file untuk menampilkan daftar mata kuliah dengan nama matakuliah.php <?php
include "koneksi.php"; //memanggil isi file koneksi.php dengan keyword include
$username=$_GET['nim']; //mengambil nilai dari URL
//query untuk menampilkan data dari table matakuliah di urutkan berdasarkan kode_mk
$query=mysql_query("select * from matakuliah order by kode_mk");
?>
<html>
<head>
<title>Mata Kuliah</title>
<!—- code untuk memanggil framework MetroUI -->
<link rel="stylesheet" href="css/metro-bootstrap.css">
<script src="js/jquery/jquery.min.js"></script>
<script src="js/jquery/jquery.widget.min.js"></script>
<script src="js/metro/metro.min.js"></script>
</head>
<body bgcolor="#32425C">
<!—- code untuk tampilan header dengan CSS inline -->
<div style="background-color:#008287;position:fixed;top:0;width:100%; height:65px;
">
<header style="position:fixed;top:0;width:100%;height:60px; background-color:
#32353A;">
<!—- tulisan pada bagian header dengan CSS inline -->
<p style="color:white; font: 20px segoe ui; text-align:center;">Daftar Mata
Kuliah</p>
</header>
</div>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
<!—- pemanggilan class metro supaya tampilan form menjadi metro(kotak2) -->
<form class="metro" method="post">
<!—- pemanggilan class table supaya tampilan table menjadi metro(kotak2) -->
<div class="table" style="padding-top:65px; padding-bottom:45px;">
<!—- table dengan tampilan striped dan CSS inline -->
<table class="table-striped" style="background-color:#EEEEEE;width:60%; height:
auto;" align="center" >
<!—- baris pertama dari tabel -->
<tr align="center" bgcolor="#459BB6" >
<td>Action</td>
<td>NO. MK</td>
<td>Nama MataKuliah</td>
<td>Semester</td>
<td>SKS</td>
<td>Dosen</td>
<td>Kelas</td>
<td>Jam</td>
</tr>
<?php //pengulangan penyimpanan semua data kedalam array
while ($row1 = mysql_fetch_array ($query)) {
extract($row1); //mengubah array kedalam variable $row1
echo"
<tr align='center'> //baris kedua dr table
<td> //link menuju file insert.php dg kode_mk = kode_mk yg diklik
// dan nim = nilai yg didapat dr URL
<a href='insert.php?kode_mk=$kode_mk && nim=$username'>AMBIL</a>
</td>
//pemanggilan data dengan memanggil atribut pada table matakuliah
<td> ".$kode_mk." </td>
<td> ".$nama_mk." </td>
<td> ".$semester." </td>
<td> ".$sks." </td>
<td> ".$dosen." </td>
<td> ".$kelas." </td>
<td> ".$jam." </td>
</tr>
";
}
echo "
//tampilan link LOGOUT dengan CSS inline
<div style='margin:auto; padding:14px; padding-left:696px; background-
color:#008287; width:60%;'>
//link LOGOUT menuju file form.php atau form login
<a href='form.php' style='background-color:#32425C; color:white; padding:10
25 6 25;'> LOGOUT </a>
</div>
";
?>
</table>
</div>
</form>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
<!—- tampilan footer dengan CSS inline -->
<div style="background-color:#008287; position:fixed; bottom:0; width:100%;
height:65px;">
<footer style="position:fixed; bottom:0; width:100%; height:60px; background-
color:#363F48;">
<!—- tulisan dibagian footer dengan CSS inline -->
<p style="color:white; font: 16px segoe ui; text-align:center;">Sistem
Informasi Akademik - UNIVERSITAS MUHAMMADIYAH JEMBER </br>
Powered by UPT - Pusat Data dan Informasi</p>
</footer>
</div>
</body>
</html>
9. Buat file insert.php untuk proses insert ke database <?php
include "koneksi.php"; //memanggil isi file koneksi.php dengan keyword include
$username=$_GET['nim']; //mengambil nilai dari URL
//query untuk menampilkan data dari table mhs dg nim = nilai yg didpt dr URL
$selectmhs="select * from mhs where nim='$username'";
$resultmhs=mysql_query($selectmhs) or die ('Error, load data mahasiswa
failed.'.mysql_error());
//menyimpan data yg dipilih kedalam array assoc
$rowmhs=mysql_fetch_assoc($resultmhs);
$kode_mk=$_GET['kode_mk']; //mengambil nilai dari URL
//query untuk menampilkan data dari table matakuliah dg kode_mk = nilai yg didpt dr
URL
$select="select * from matakuliah where kode_mk='$kode_mk'";
$result=mysql_query($select) or die ('Error, load data matakuliah
failed.'.mysql_error());
//menyimpan data yg dipilih kedalam array assoc
$row=mysql_fetch_assoc($result);
//memanggil data dan disimpan sebagai variable
$kode_mk= $row['kode_mk'];
$nama_mk=$row['nama_mk'];
$semester=$row['semester'];
$sks=$row['sks'];
$dosen=$row['dosen'];
$kelas=$row['kelas'];
$jam=$row['jam'];
$status="BELUM";
$nim=$rowmhs['nim'];
$nama=$rowmhs['nama_mhs'];
//query untuk insert data kedalam table krs
$insert="insert into krs values('$kode_mk','$nama_mk',$semester,$sks,'$dosen',
'$kelas','$jam','$status','$nim','$nama')";
Pemrograman Berbasis Web
Pemrograman Berbasis Web
//kondisi jika variable sukses dijalankan
if(mysql_query($insert)){
//menuju link krs.php dg nim = nilai yg didapat dr URL
echo"<script>window.location.href='krs.php?nim=$username';</script>";
}else{
//jika variable tidak sukses dijalankan maka keluar peringatan dan program akan
menampilkan matakuliah.php dg nim = nilai yg didpat dr URL
echo"<script>alert('Error!! Mata kuliah sudah diambil!');</script>";
echo"<script>window.location.href=’ matakuliah.php?nim=$username';</script>"; }
?>
10. Buat file krs.php untuk menampilkan matakuliah yang diambil mahasiswa <?php
include "koneksi.php"; //memanggil isi file koneksi.php dengan keyword include
$username=$_GET['nim']; //mengambil nilai dari URL
//query untuk memilih data mahasiswa dimana nim = nilai yg didapat dari URL
$querymhs=mysql_query("select * from mhs where nim='$username'");
//menyimpan data kedalam array assoc dg variable row
$row=mysql_fetch_assoc($querymhs);
//query untuk menampilkan semua data yang ada di table krs
$querysql=mysql_query("select *from krs");
?>
<html>
<head><title>KRS</title>
<!—- code untuk memanggil framework MetroUI -->
<link rel="stylesheet" href="css/metro-bootstrap.css">
<script src="js/jquery/jquery.min.js"></script>
<script src="js/jquery/jquery.widget.min.js"></script>
<script src="js/metro/metro.min.js"></script>
</head>
<body bgcolor="#32425C">
<!—- code untuk tampilan header dengan CSS inline -->
<div style="background-color:#008287; position:fixed; top:0; width:100%;
height:65px;">
<header style="position:fixed;top:0;width:100%;height:60px; background-
color:#32353A;">
<!—- tulisan pada bagian header dengan CSS inline -->
<p style="color:white; font: 20px segoe ui; text-align:center;">Kartu Rencana
Studi (KRS)</p>
</header>
</div>
<!—- pemanggilan class metro supaya tampilan form menjadi metro(kotak2) -->
<form class="metro" method="post">
<!—- pemanggilan class table supaya tampilan table menjadi metro(kotak2) -->
<div class="table" style="padding-top:70px;">
<!—- table dengan CSS inline untuk menampilkan data mahasiswa-->
<table style="background-color:#EEEEEE; width:80%; height:auto; " align="center" >
<tr>
<td width="150px">NIM</td>
<td>:</td>
<td><?php echo $row['nim'];?></td> <!—- menampilkan data nim dr database -->
Pemrograman Berbasis Web
Pemrograman Berbasis Web
<td width="100px">Semester</td>
<td>:</td>
<!—- menampilkan data semester dr database -->
<td width="150px"><?php echo $row['semester'];?></td>
</tr>
<tr>
<td width="150px">NAMA</td>
<td>:</td>
<!—- menampilkan data nama_mhs dr database -->
<td><?php echo $row['nama_mhs'];?></td>
<td width="100px">Jurusan</td>
<td>:</td>
<!—- menampilkan data jurusan dr database -->
<td width="150px"><?php echo $row['jurusan'];?></td>
</tr>
</table>
<!—- table dg CSS inline untuk menampilkan data matakuliah yg diambil -->
<table style="background-color:#EEEEEE; width:80%; height:auto; " align="center" >
<!—- baris 1 pd table -->
<tr align="center" bgcolor="#459BB6" >
<td>NO. MK</td>
<td>Nama MataKuliah</td>
<td>Semester</td>
<td>SKS</td>
<td>Dosen</td>
<td>Kelas</td>
<td>Jam</td>
<td>Status</td>
<td>Action</td>
</tr>
<?php
//pengulangan penyimpanan semua data kedalam array
while ($row1 = mysql_fetch_array ($querysql)) {
extract($row1); //mengubah array kedalam variable $row1
echo"
//baris kedua
<tr align='center'>
//pemanggilan data dengan memanggil atribut pada table krs
<td> ".$kode_mk." </td>
<td> ".$nama_mk." </td>
<td> ".$semester." </td>
<td> ".$sks." </td>
<td> ".$dosen." </td>
<td> ".$kelas." </td>
<td> ".$jam." </td>
<td> ".$status." </td>
//link menuju file delete.php dg kode_mk = kodemk yg diklik dan nim =
nilai yang didapat dari URL
<td><a href ='delete.php?kode_mk=$kode_mk &&
nim=$username'>DELETE</a></td>
</tr>
";
Pemrograman Berbasis Web
Pemrograman Berbasis Web
}
echo "
//tampilan link dengan CSS inline
<div style='margin:auto; padding:10px; background-color:#EEEEEE; width:80%;
align:center;'>
//link untuk ambil mk menuju matakuliah dg nim = nilai yg didapat dari URL
<a href ='matakuliah.php?nim=$username'>AMBIL MK</a>
//spasi
             &emsp
; 
             &emsp
; 
KRS Mahasiswa
//spasi
             &emsp
;
             &emsp
; 
//link untuk keluar dari SIA menuju form.php
<a href ='form.php'>LOG OUT</a>
</div>
";
?>
</table>
</div>
</form>
<!—- tampilan footer dengan CSS inline -->
<div style="background-color:#008287; position:fixed; bottom:0; width:100%;
height:65px;">
<footer style="position:fixed; bottom:0; width:100%; height:60px; background-
color:#363F48;">
<!—- tulisan dibagian footer dengan CSS inline -->
<p style="color:white; font: 16px segoe ui; text-align:center;">Sistem Informasi
Akademik - UNIVERSITAS MUHAMMADIYAH JEMBER </br>
Powered by UPT - Pusat Data dan Informasi</p>
</footer>
</div>
</body>
</html>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
11. Buat file delete.php untuk proses delete data <?php
include "koneksi.php"; //memanggil isi file koneksi.php dengan keyword include
$kode_mk=$_GET['kode_mk']; //mengambil nilai dari URL
$username=$_GET['nim']; //mengambil nilai dari URL
//kondisi jika kode_mk terpenuhi
if(isset($_GET['kode_mk'])){
//query untuk menghapus data dari table krs dimana kode_mk = nilai yang didapat dari
URL
$sqldelete = 'DELETE FROM krs WHERE kode_mk= "'.$_GET['kode_mk'].'" ';
mysql_query($sqldelete) or die('Delete data failed. ' . mysql_error());
//setelah proses delete dilakukan, maka program menuju file krs.php dengan nim =
nilai yg didapat dari URL
echo "<script>window.location.href='krs.php?nim=$username';</script>";
}
?>
12. Terakhir buat file update.php untuk proses edit data mahasiswa <?php
include "koneksi.php"; //memanggil isi file koneksi.php dengan keyword include
$username=$_GET['nim']; //mengambil nilai dari URL
//query untuk mimilih data mahasiswa dimana nim = nilai yang didapat dari URL
$selectmhs="select * from mhs where nim='$username'";
$resultmhs=mysql_query($selectmhs) or die ('Error, load data mahasiswa
failed.'.mysql_error());
//kemudian disimpan dalam array assoc
$rowmhs=mysql_fetch_assoc($resultmhs);
?>
<html>
<head><title>Detail Mahasiswa</title>
<!—- code untuk memanggil framework MetroUI -->
<link rel="stylesheet" href="css/metro-bootstrap.css">
<script src="js/jquery/jquery.min.js"></script>
<script src="js/jquery/jquery.widget.min.js"></script>
<script src="js/metro/metro.min.js"></script>
</head>
<body bgcolor="#32425C">
<!—- code untuk tampilan header dengan CSS inline -->
<div style="background-color:#008287; position:fixed; top:0; width:100%;
height:65px;">
<header style="position:fixed; top:0; width:100%; height:60px; background-
color:#32353A;">
<!—- tulisan pada bagian header dengan CSS inline -->
<p style="color:white; font: 20px segoe ui; text-align:center;">Detail
Mahasiswa</p>
<!—- tampilan button LOGOUT dengan class default dan ukuran small dari MetroUI -->
<div class="metro" align="right">
<button onclick="window.location='form.php'" class="default && small">LOG
OUT</button>
</div>
</header>
</div>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
<!—- pemanggilan class metro supaya tampilan form menjadi metro(kotak2) -->
<form class="metro" method="post">
<!—- tampilan judul dengan CSS inline -->
<div style="margin:auto; padding:10px; background-color:#008287; width:35%;">
<h1 align="center" style="padding-top:150px; color:white;">Update Mahasiswa</h1>
</div>
<!—- table untuk mengedit data mahasiswa -->
<table style="background-color:#EEEEEE; width:35%; height:32%;" align="center" >
<tr>
<td width="95px">NIM</td>
<td>:</td>
<!—- inputfield untuk mengedit nim -->
<td><input size="45px" type="text" name="nim" value="<?php echo
$rowmhs['nim']; ?>" disabled></td>
</tr>
<tr>
<td width="95px">Password</td>
<td>:</td>
<!—- inputfield untuk mengedit password -->
<td><input size="45px" type="text" name="password" value="<?php echo
$rowmhs['password']; ?>"></td>
</tr>
<tr>
<td width="95px">Nama</td>
<td>:</td>
<!—- inputfield untuk mengedit nama mahasiswa -->
<td><input size="45px" type="text" name="nama" value="<?php echo
$rowmhs['nama_mhs']; ?>"></td>
</tr>
<tr>
<td width="95px">Alamat</td>
<td>:</td>
<!—- inputfield untuk mengedit alamat -->
<td><input size="45px" type="text" name="alamat" value="<?php echo
$rowmhs['alamat']; ?>"></td>
</tr>
<tr>
<td width="95px">Tanggal Lahir</td>
<td>:</td>
<!—- inputfield untuk mengedit tanggal lahir -->
<td><input size="45px" type="date" name="tanggal " value="<?php echo
$rowmhs['tanggal_lahir']; ?>"></td>
</tr>
<tr>
<td width="95px">Jurusan</td>
<td>:</td>
<!—- inputfield untuk mengedit jurusan -->
<td><input size="45px" type="text" name="jurusan" value="<?php echo
$rowmhs['jurusan']; ?>"></td>
</tr>
Pemrograman Berbasis Web
Pemrograman Berbasis Web
<tr>
<!—- button dengan name = update -->
<td colspan="3" align="center"><input class="default"type="submit"
name="update" value="UPDATE"></td>
</tr>
</table>
<?php
if(isset($_POST['update'])){ //kondisi jika button “update” diklik
$pass=$_POST['password']; //mengambil nilai dari inputfield password
$nama=$_POST['nama']; //mengambil nilai dari inputfield nama
$alamat=$_POST['alamat']; //mengambil nilai dari inputfield alamat
$tanggal=$_POST['tanggal’]; //mengambil nilai dari inputfield tanggal
$jurusan=$_POST['jurusan']; //mengambil nilai dari inputfield jurusan
//query untuk update data pada table mhs dimana data data yg diupdate berdasarkan
nim = nilai yg didapat dari URL
$sql = "update mhs set password='$pass', nama_mhs='$nama', jurusan='$jurusan',
alamat='$alamat', tanggal_lahir='$tanggal' where nim='$username'";
mysql_query($sql) or die('Update data failed. ' . mysql_error());
//link menuju home.php dengan nim dan password = nilai yang didapat dari URL
echo "<script>window.location.href='home.php?nim=$username && password=$pass';
</script>";
}
?>
</form>
<!—- tampilan footer dengan CSS inline -->
<div style="background-color:#008287; position:fixed; bottom:0; width:100%;
height:65px;">
<footer style="position:fixed; bottom:0;width:100%;height:60px; background-
color:#232A2B;">
<!—- tulisan dibagian footer dengan CSS inline -->
<p style="color:white; font: 16px segoe ui; text-align:center;">Powered by UPT -
Pusat Data dan Informasi</p>
</footer>
</div>
</body>
</html>
Setelah semua file dibuat, letakkan file-file tersebut di dalam direktori framework MetroUI.
Jika belum punya framework MetroUI, bisa download di sini: http://metroui.org.ua/
Demikian tutorial CRUD KRS Online yang saya buat, semoga usaha saya bermanfaat dan di
nilai baik oleh dosen saya :D
Terima kasih…