CRUD Using PHP JQuery
Uploaded by
Sapri AdiCRUD Using PHP JQuery
Uploaded by
Sapri Adi2016
C.R.U.D using Php &
JQuery
PRAKTIKUM WEB DESAIN
DWI SETIYA NINGSIH // 210 315 70 25
[COMPANY NAME] | [Company address]
C.R.U.D using Php & JQuery
a) Source Code & Analisis
koneksi.php
<?php
$con=mysqli_connect("localhost","root","");
$db=mysqli_select_db($con,"sekolah");
?>
Analisis:
Digunakan untuk menghubungkan ke database
Controller.php
<?php
if(isset($_POST['nama'])){
include_once "koneksi.php";
include_once "model.php";
$data['nama']=$_POST['nama'];
$data['alamat']=$_POST['alamat'];
$data['email']=$_POST['email'];
$hasil=simpan_data($data,$con);
if($hasil){
$output="<div class='alert alert-info'>Data Berhasil
disimpan</div>";
}
else{
$output="</div class='alert alert-info'>Data Gagal
disimpan</div>";
}
$output.=lihat_data($con);
echo $output;
} else {
$output=lihat_data($con);
}
?>
Analisis:
Digunakan untuk memproses/menjalankan proses CRUD
lihat_data.php
<?php
include_once "koneksi.php";
include_once "model.php";
include_once "controller.php";
?>
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/mhs.js"></script>
<div class="container">
<div class="row" style="margin-top: 20px;">
<div class="col-sm-6">
<h3>Data Siswa</h3>
<div id="hasildata">
<?php echo $output;
?>
</div>
</div>
<div class="col-sm-6" style="border-left: 2px solid
#dddddd; min-height: 300px;">
<form class="form-horizontal" id="form_mhs">
<h3>Tambah Data Baru</h3>
<div class="form-group">
<label for="nama" class="col-sm-2
control-label">Nama</label>
<div class="col-sm-10">
<input type="text" id="nama"
class="form-control" placeholder="Nama Mahasiswa">
</div>
</div>
<div class="form-group">
<label for="alamat" class="col-sm-2
control-label">Alamat</label>
<div class="col-sm-10">
<input type="text" id="alamat"
class="form-control" placeholder="Alamat Mahasiswa">
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2
control-label">Email</label>
<div class="col-sm-10">
<input type="text" id="email"
class="form-control" placeholder="Email Mahasiswa">
</div>
</div>
<div class="form-group">
<label for="nama" class="col-sm-2 control-
label"></label>
<div class="col-sm-10">
<button class="btn btn-primary"
id="simpan">Simpan</button>
</div>
</div>
</form>
</div>
</div>
</div>
Analisis:
Lihat_data.php berfungsi sebagai create data form
Model.php
<?php
function lihat_data($con) {
$sql="select*from mahasiswa order by id desc";
$hasil=mysqli_query($con,$sql);
$output="<table class='table table-striped'>";
$output.="<tr><th>Nama</th> <th>Alamat</th>
<th>Email</th> <th>Operasi</th></tr>";
while($row=mysqli_fetch_array($hasil)) {
$output.="<tr><td>".$row['nama']."</td>";
$output.="<td>".$row['alamat']."</td>";
$output.="<td>".$row['email']."</td>";
$output.="<td><a href='#' class='btn btn-info
edit'>Edit</a> ";
$output.="<a href='delete.php?id=$row[id]' class='btn
btn-danger hapus'>Delete</a></td> ";
$output.="</tr>";
}
$output.="</table>";
return $output;
}
function simpan_data($data,$con){
$sql="insert into mahasiswa (nama,alamat,email)
values
('".$data['nama']."','".$data['alamat']."','".$data['email']."'
)";
$hasil=mysqli_query($con,$sql);
if($hasil)
return TRUE;
else
return FALSE;
}
?>
Analisis:
model.php berfungsi sebagai index atau homepage sebuah halaman. Namun
karena script diatas murni php maka akan di over ke halaman lain yang memiliki
syntax html (dalam hal ini di over ke halaman lihat_data.php dengan memanggil
function lihat_data)
Delete.php
<?php
$konek=mysqli_connect("localhost","root","","sekolah");
$id=$_GET['id'];
$hapus="DELETE FROM mahasiswa WHERE id='$id'";
$hasil=mysqli_query($konek, $hapus);
if($hasil){
header("location:lihat_data.php");
}
else{
echo "Maaf anda gagal delete";
}
?>
Analisis:
delete.php berfungsi untuk menghapus data satu array yang ditandai dengan
id, yang kemudian dioverkan dengan fungsi header menuju ke halaman
lihat_data.php
Edit.php
**skrip gagal terus pak T.T**
b) SS Program
Gambar 1.1 Tampilan awal dengan satu data tersedia
Gambar 1.2 Tampilan setelah melakukan proses tambah data
Gambar 1.3 Tampilan setelah melakukan proses hapus data
