Haikal PG - XI RPL 1 - PWPB Sesi 29

Assalamualaikum Warahmatullahi Wabarokatuh
Apa kabar semuanya? Semoga sehat selalu ya.... Pada sesi kali ini kita akan melanjutkan materi kita tentang database dan jika teman-teman belum membaca artikel-artikel sebelumnya tentang database dan pemahaman tentang sintaks-sintaks php saya harapkan untuk dibaca terlebih dahulu ya....
Jika sebelumnya kita sudah membuat sebuah database dan mencoba menampilkan data dan juga menambah data baru. Nah, kali ini kita akan menambah aksi-aksi lain seperti edit dan juga delete. Ya, langsung saja kita mulai.

Step 1
Buka file v_index.php yang telah kita buat di pertemuan sebelumnya dan berada di folder views dan coba teman-teman tambahkan aksi berikut:

<a href="edit.php?nis=<?= $siswa['nis'] ?>">Edit Data</a>

Copy code diatas dan simpan didalam table/kolom baru. Untuk full code v_index.php sebagai berikut:

<!DOCTYPE html>
<html>
<head>
	<title>Haikal Putra Gustiansyah XI RPL 1  Connect To Database</title>
	<style type="text/css">
		body{
			font-family: arial;
			background-color: lightgrey;
		}
		th{
			background-color: cyan;
		}
		td{
			background-color: ghostwhite;
		}
		button{
			background-color: #34a1eb;
			padding: 10px;
			border-radius: 5px;
			border: 0px;
			transition: 0.5s;
		}
		button a{
			text-decoration: none;
			color: white;
			font-family: cursive;
		}
		button:hover{
			background-color: black;
			color: white;
			cursor: pointer;
		}
		input{
			border-radius: 4px;
			border: 1px solid black;
		}
	</style>
</head>
<body>

	<button><a href="tambah.php">Tambah Data</a></button><br><br>

	<table border="1" cellspacing="0" cellpadding="5">
<tr>
			<th>#</th>
			<th>NIS</th>
			<th>Nama Lengkap</th>
			<th>Jenis Kelamin</th>
			<th>Kelas</th>
			<th>Jurusan</th>
			<th>Alamat</th>
			<th>Golongan Darah</th>
			<th>Nama Ibu Kandung</th>
			<th colspan="2">Aksi</th>
		</tr>
<?php 
				$i = 1;
				while ($siswa = $listSiswa->fetch_array()) {
		 ?>
<tr>
			<td><?= $i++ ?></td>
			<td><?= $siswa['nis'] ?></td>
			<td><?= $siswa['nama_lengkap'] ?></td>
			<td><?= $siswa['jenis_kelamin'] ?></td>
			<td><?= $siswa['kelas'] ?></td>
			<td><?= $siswa['jurusan'] ?></td>
			<td><?= $siswa['alamat'] ?></td>
			<td><?= $siswa['golongan_darah'] ?></td>
			<td><?= $siswa['nama_ibu_kandung'] ?></td>
			<td><button><a href="edit.php?nis=<?= $siswa['nis'] ?>">Edit Data</a></button></td>
		</tr>
<?php } ?>
	</table>
</body>
</html>

Kita menambahkan aksi edit.php dengan href/tujuannya yaitu 'edit.php' dan juga nis sesuai data nis yang ditampilkan dan nantinya kita akan buat file edit.php dan menangkapnya dengan method GET.
Jika code diatas dijalankan maka akan tampil seperti ini:

Step 2
Coba teman-teman buat file edit.php didalam folder siswa yang telah kita buat dan copykan code berikut:

<?php 
	include 'lib/library.php';

	$nis = $_GET['nis'];

	if (empty($nis)) 
		header("location: index.php");


		$sql = "SELECT * FROM siswa WHERE nis = '$nis'";
		$query = $mysqli->query($sql);
		$siswa = $query->fetch_array();
		

		if (empty($siswa)) 
			header("location: index.php");
		
		include 'views/v_tambah.php';
 ?>

Penjelasan:
Pertama kita menangkap sebuah nis dengan method GET lalu pengecekan, jika nis empty atau kosong maka akan diarahkan ke index.php dan yang kedua ia mengambil data dari tabel siswa sesui nis yang dikirimkan dari GET. dan juga ada $siswa = $query->fetch_array(); yang berarti ia hanya akan mengambil data baris pertama saja.

Step 3
Silahkan teman-teman kembali ke folder views dan silahkan buka file v_tambah.php. Kita akan sedikit mengubahnya. Copykan code berikut:

<!DOCTYPE html>
<html>
<head>
	<title>Haikal Putra Gustiansyah XI RPL 1 Add Data's</title>
	<style type="text/css">
		body{
			background-color: lightgrey;
		}
		button{
			background-color: #34a1eb;
			padding: 10px;
			border-radius: 5px;
			border: 0px;
			transition: 0.5s;
		}
		button a{
			text-decoration: none;
			color: white;
			font-family: cursive;
		}
		button:hover{
			background-color: black;
			color: white;
			cursor: pointer;
		}
		input{
			border-radius: 4px;
			border: 1px solid black;
		}
	</style>
</head>
<body>
	<?php 
		$action = 'tambah.php';
		if (!empty($siswa)) $action = 'edit.php';

	 ?>
	<form action="<?= $action ?>
" method="post">
		<table>
<tr>
			<td><label for="nis">NIS</label></td>
			<td><input type="text" id="NIS" name="nis" value="<?= @$siswa['nis'] ?>" <?= @$siswa['nis'] != "" ? 'readonly' : '' ?>  "></td>
		</tr>
<tr>
			<td><label for="nama">Nama Lengkap</label></td>
			<td><input type="text" name="nama_lengkap" id="nama" value="<?= @$siswa['nama_lengkap'] ?>"></td>
		</tr>
<tr>
			<td><label for="jk">Jenis Kelamin</label></td>
			<td>
				<input type="radio" name="jenis_kelamin" value="L"  <?= @$siswa['jenis_kelamin'] == 'L' ? 'checked' : ''?>>Laki-Laki<br>
				<input type="radio" name="jenis_kelamin" value="P" <?= @$siswa['jenis_kelamin'] == 'P' ? 'checked' : '' ?>>Perempuan
			</td>
		</tr>
<tr>
			<td>Kelas</td>
			<td>
				<select name="kelas">
			<option value="XI-RPL-1" <?= @$siswa['kelas'] == 'XI-RPL-1' ? 'selected' :  '' ?>>XI-RPL-1</option>
			<option value="XI-RPL-2" <?= @$siswa['kelas'] == 'XI-RPL-2' ? 'selected' :  '' ?>>XI-RPL-2</option>
			<option value="XI-RPL-3" <?= @$siswa['kelas'] == 'XI-RPL-3' ? 'selected' :  '' ?>>XI-RPL-3</option>
				</select>
	</td>
		</tr>
<tr>
			<td><label for="jurus">Jurusan</label></td>
			<td><input type="text" id="jurus" name="jurusan" value="<?= @$siswa['jurusan'] ?>"></td>
		</tr>
<tr>
			<td><label for="alamat">Alamat</label></td>
			<td><input name="alamat" id="alamat" value="<?= @$siswa['alamat'] ?>"></input></td>
		</tr>
<tr>
			<td><label for="goldar">Golongan Darah</label></td>
			<td><input type="text" name="golongan_darah" id="goldar" value="<?= @$siswa['golongan_darah'] ?>"></td>
		</tr>
<tr>
			<td><label for="ibu">Nama Ibu Kandung</label></td>
			<td><input type="text" name="nama_ibu_kandung" id="ibu" value="<?= @$siswa['nama_ibu_kandung'] ?>"></td>
		</tr>
<tr>
			<td></td>
		</tr>
<tr>
			<td></td>
			<td><button type="submit" value="simpan">Simpan</button></td>
		</tr>
</table>
</form>
</body>
</html>

Penjelasan:
Untuk melakukan edit data, kita menggunakan form tambah yang sudah kita buat dengan kodisi untuk menentukan kapan form menjadi mode tambah, dan kapan form menjadi mode edit
Form mode tambah ketika tidak ada variable $siswa yang dikirim ke views/v_tambah.php dan Form mode edit ketika ada variable $siswa yang dikirim ke views/v_tambah.php
Coba teman teman perhatikan sebuah tag php diatas form, Kondisi tersebut disimpan di baris paling awal file v_tambah.php dan action pada form diganti menggunakan variable. Coba perhatikan value input dari NIS, value tersebut digunakan untuk memberikan value pada input text tersebut. Vlue berasal dari data siswa dan juga kenapa ada symbol @? symbol ini digunakan untuk menyembunyikan warning apabila variable undefined. Coba perhatikan juga pada tag select HTML yang dimana option tersebut berisi sebuah if-ternary yang artinya jika $siswa['kelas'] sama dengan XI-RPL1 maka input radio akan berstatus selected.

Step 4
Di langkah ini kita buka lagi file edit.php dan kita copy kan code berikut:

<?php 
	include 'lib/library.php';


	if ($_SERVER['REQUEST_METHOD'] == 'POST') {
		$nis = $_POST['nis'];
		$nama_lengkap = $_POST['nama_lengkap'];
		$jenis_kelamin = $_POST['jenis_kelamin'];
		$kelas = $_POST['kelas'];
		$jurusan = $_POST['jurusan'];
		$alamat = $_POST['alamat'];
		$golongan_darah = $_POST['golongan_darah'];
		$ibu = $_POST['nama_ibu_kandung'];


		$sql = "UPDATE siswa SET nis = '$nis', nama_lengkap = '$nama_lengkap', jenis_kelamin = '$jenis_kelamin', kelas = '$kelas', jurusan = '$jurusan', alamat = '$alamat', golongan_darah = '$golongan_darah', nama_ibu_kandung = '$ibu' WHERE nis = '$nis' ";

		$mysqli->query($sql) or die($mysqli->error);

		header("location: index.php");
	}




	$nis = $_GET['nis'];

	if (empty($nis)) 
		header("location: index.php");


		$sql = "SELECT * FROM siswa WHERE nis = '$nis'";
		$query = $mysqli->query($sql);
		$siswa = $query->fetch_array();
		

		if (empty($siswa)) 
			header("location: index.php");
		
		include 'views/v_tambah.php';
 ?>

Kita menambahan code yang kita gunakan untuk edit data. Penjelasan:
pertama ada kondisi jika request method post maka kita masukkan seluruh data tadi untuk kita update. Selanjutnya ada sebuah variable yang menyimpan query UPDATE siswa SET valuenya.... Ini digunakan agar data yang kita ubah tadi terupdate dan berhasil diubah, lalu kita querykan dan mengarahkannya kembali ke index.php.
Dan jika dijalankan dan kita coba update salah satu data maka akan seperti ini hasilnya:

Dan kita coba update nama ibu kandung dari 'Haikal Putra Gustiansyah' dengan ini:

Dan kita klik Simpan maka data akan terupdate seperti ini:

Data pun terubah..........

Study Kasus
Sebenarnya code diatas sudah termasuk study kasus yang dimana syaratnya seperti berikut:

Tambahkan kolom jurusan,alamat, golongan darah,nama ibu kandung
Pada form edit kita tidak bisa mengubah NIS

Yah... jadi..... saya jelaskan saja ya... saya akan menjelaskan form edit tidak dapad mengubah NIS, jadi ini maksudnya pada mode edit kita tidak bisa mengubah NIS yang ditetapkan jadi kita menambahkan sebuah ternary di sebuah tag input seperti berikut:

<?= @$siswa['nis'] != "" ? 'readonly' : '' ?>

Nah seperti teman-teman lihat, code diatas merupakan sebuah ternary operator jika nilainya true maka tag input bersifat readonly dan jika false dia akan memberikan nilai kosong....

Jadi mungkin sekian saja untuk kali ini dan juga jangan lupa untuk mengikuti sesi-sesi PWPB yang akan datang.. Sekian, Wassalamualaikum Warahmatullahi Wabarokatuh

Pemrograman Web Dan Perangkat Bergerak

Cari Blog Ini

Haikal PG - XI RPL 1 - PWPB Sesi 29

Komentar

Posting Komentar

Postingan populer dari blog ini

Haikal PG - XI RPL 1 - PWPB Sesi 36

Haikal PG - XI RPL 1 - PWPB Sesi 25

Haikal PG - XI RPL 1 - PWPB Sesi 7