Download - OOP 171215
![Page 1: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/1.jpg)
{ Object Oriented Programming
Pertemuan 17-12-2015
![Page 2: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/2.jpg)
Aplikasi Input Data pada PHP
1. Sebagai langkah awal, buat folder baru pada
C:/xampp/htdocs dengan nama belajar. Folder ini
akan menjadi area kerja dalam pembuatan aplikasi
yang nantinya dapat diakses menggunakan
browser dengan mengetikkan
localhost/nama_folder.
2. Buat database dengan nama belajar. Kemudian
buat tabel dengan nama user .
![Page 3: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/3.jpg)
Gambar 1 Tabel User
Membuat Database dan Table
![Page 4: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/4.jpg)
3. Buat koneksi ke database terlebih dahulu dengan membuat file script
html pada Notepad dengan nama config.php. Seperti script dibawah ini :
<?php //Host yang digunakan $host = 'localhost'; //Username untuk login ke host $user = 'root'; //Apabila menggunakan PC pribadi sebagai host, secara default password dikosongkan $pass = '';
//Isikan nama database sesuai database //yang telah dibuat $dbname = 'belajar'; //Untuk menghubungkan ke host $connect = mysql_connect($host, $user, $pass) or die(mysql_error()); //Untuk memilih database yang akan digunakan $dbselect = mysql_select_db($dbname);
File config.php tersebut nantinya dapat digunakan pada file-file lain dalam
menghubungkan ke server untuk menyimpan, merubah, maupun
menghapus data.
Membuat Koneksi ke Database
![Page 5: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/5.jpg)
Ketikkan kode berikut pada Notepad, kemudian simpan dalam folder belajar dengan
nama index.php.
Membuat Form Input Data
<html> <head> <title>Belajar PBO dengan PHP</title> </head> <body> <h1>Form Input Data User</h1> <?php if (!empty($_GET['message']) && $_GET['message'] == 'success') { echo '<h3>Anda Berhasil Menambah Data!</h3>'; } ?> <form name="input_data" action=" insert.php"method="post"> <table border="0" cellpadding="5" cellspacing="0"> <tbody> <tr> <td>Username</td> <td>:</td> <td><input type="text" name="username" maxlength="20" required="required"
Teks script yang berwarna merah,
untuk menampilkan pesan
sukses ketika berhasil
menyimpan data.
![Page 6: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/6.jpg)
![Page 7: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/7.jpg)
<td>Agama</td> <td>:</td> <td><input type="text" name="agama" required="required" /></td> </tr> <tr> <td>Nomor HP</td> <td>:</td> <td><input type="text" name="no_hp" maxlength="14" required="required" /></td> </tr> <tr> <td align="right" colspan="3"><input type="submit" name="submit" value="Simpan" /></td> </tr> </tbody> </table> </form> <a href="view.php">Lihat Data</a> | <a href="logout.php">Logout</a> </body> </html>
Sekarang coba buka pada browser dan ketikkan localhost/belajar pada address
bar, maka akan tampil form input data seperti ini Gambar 2.
Untuk menampilkan halaman daftar
data-data yang telah disimpan
![Page 8: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/8.jpg)
Gambar 2 Tampilan Form Input
![Page 9: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/9.jpg)
<?php //Panggil file config.php untuk menghubungkan ke server include('config.php'); //Baca data dari form $username = $_POST['username']; $password = $_POST['password']; $fullname = $_POST['fullname']; $email = $_POST['email']; $agama = $_POST['agama']; $no_hp = $_POST['no_hp']; //Simpan data ke database $query = mysql_query("insert into user values('', '$username', '$password', '$email', '$fullname', '$agama', '$no_hp')") or die(mysql_error()); if ($query) { header('location:index.php?message=success'); }
Menyimpan Data
Ketikkan kode script dibawah ini dan simpan dengan nama insert.php.
![Page 10: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/10.jpg)
Jalankan aplikasi dengan mengetikkan localhost/belajar pada browser.
Kemudian isikan data pada form, lalu klik tombol Simpan.
Apabila berhasil, maka akan ditampilkan pesan Anda Berhasil Menambah
Data! , seperti Gambar 3. Apabila gagal, maka periksa kembali script pada
notepad yang telah diketik.
Gambar 3 Halaman Pesan Berhasil Tambah Data
![Page 11: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/11.jpg)
Menampilkan Data
1. Buat halaman untuk menampilkan data-data yang telah di simpan.
2. Ketikkan script dibawah ini pada notepad dan simpan dengan nama view.php.
<?php include('config.php') ?> <html> <head> <title>Belajar PBO dengan PHP</title> </head> <body> <h1>Data User</h1> <?php if (!empty($_GET['message']) && $_GET['message'] == 'success') { echo '<h3>Anda Berhasil Update Data!</h3>'; } ?> <a href="index.php">+ Tambah Data</a> | <a href="logout.php"> Logout</a> <table border="1" cellpadding="5" cellspacing="0"> <thead> <tr> <td>No.</td> <td>Username</td> <td>Password</td> <td>Email</td> <td>Fullname</td> <td>Agama</td>
Baris script yang berwarna kuning
merupakan script tambahan untuk
memberikan info pesan bahwa update data
berhasil.
![Page 12: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/12.jpg)
<td>No. HP</td> <td>Opsi</td> </tr> </thead> <tbody> <?php $query = mysql_query("select * from user"); $no = 1; while ($data = mysql_fetch_array($query)) { ?> <tr> <td><?php echo $no; ?></td> <td><?php echo $data['username']; ?></td> <td><?php echo $data['password']; ?></td> <td><?php echo $data['email']; ?></td> <td><?php echo $data['fullname']; ?></td> <td><?php echo $data['agama']; ?></td> <td><?php echo $data['no_hp']; ?></td> <td> <a href="edit.php?id=<?php echo $data['user_id']; ?>">Edit</a> || <a href="delete.php?id=<?php echo $data['user_id']; ?>">Hapus</a> </td> </tr> <?php $no++; } ?> </tbody> </table> </body> </html>
Baris script yang berwarna kuning adalah
baris script LINK tambahan.
![Page 13: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/13.jpg)
Untuk melihat hasilnya, jalankan aplikasi dengan mengetikkan
localhost/belajar/view.php pada address bar !
Gambar 4 Halaman View.php
![Page 14: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/14.jpg)
Update Data
Dalam suatu aplikasi, update data diperlukan untuk mengatasi
masalah pada kesalahan input, kesalahan data yang
dimasukkan, dan lainnya. Oleh sebab itu data salah yang telah
tersimpan dalam database dapat diedit / diperbaiki.
Pada dasarnya, form edit data sama dengan form input data.
Yang membedakan hanya pada form edit tersebut, data yang
akan diedit dapat ditampilkan.
Langkah-langkah membuat form edit data :
1. Pada notepad buat file baru dengan nama edit.php
2. Salin semua script file index.php kedalam file edit.php
3. Tambahkan beberapa script agar data yang akan diedit
dapat ditampilkan.
![Page 15: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/15.jpg)
![Page 16: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/16.jpg)
<tr> <td>Username</td> <td>:</td> <td><input type="text" name="username" maxlength="20" required="required" value="<?php echo $data['username']; ?>" disabled /></td> </tr> <tr> <td>Password</td> <td>:</td> <td><input type="password" name="password" maxlength="20" required="required" value="<?php echo $data['password']; ?>" /></td> </tr> <tr> <td>Fullname</td> <td>:</td> <td><input type="text" name="fullname" maxlength="100" required="required" value="<?php echo $data['fullname']; ?>" /></td> </tr> <tr> <td>Email</td> <td>:</td> <td><input type="email" name="email" required="required" value="<?php echo $data['email']; ?>" /></td> </tr>
Penggunaan atribut disabled,
agar username tidak dapat dirubah
![Page 17: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/17.jpg)
<tr> <td>Agama</td> <td>:</td> <td><input type="text" name="agama" required="required" value="<?php echo $data['agama']; ?>" /></td> </tr> <tr> <td>Nomor HP</td> <td>:</td> <td><input type="text" name="no_hp" maxlength="14" required="required" value="<?php echo $data['no_hp']; ?>" /></td> </tr> <tr> <td align="right" colspan="3"><input type="submit" name="submit" value="Simpan" /></td> </tr> </tbody> </table> </form> <td><a href="edit.php?id=<?php echo $data['user_id']; ?>">Edit</a> || <a href="#">Hapus</a></td> </body> </html>
Baris script yang berwarna kuning
pengganti script sebelumnya :
<a href="view.php">Lihat Data</a>
![Page 18: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/18.jpg)
Sampai pada tahapan ini perubahan data belum
dapat dilakukan, melainkan hanya dapat
menampilkan data pada form edit saja.
Untuk dapat merubah data pada database,
maka perlu dibuat query SQL lagi untuk meng-
update database dengan data yang baru.
Langkah-langkanya adalah sebagai berikut :
1. Buat file baru dengan nama update.php
2. Ketikkan kode script berikut :
![Page 19: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/19.jpg)
![Page 20: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/20.jpg)
3. Tambahkan baris script berikut pada file view.php setelah <h1> </h1>
<?php if (!empty($_GET['message']) && $_GET['message'] == 'success') { echo '<h3>Berhasil meng-update data!</h3>'; } ?>
Perubahan script pada file view.php setelah ditambahkan baris script diatas,
dapat dilihat pada pembahasan / slide sebelumnya.
1. Apabila tahapan ini sudah dilakukan, maka untuk mengetahui form edit
data berfungsi dengan benar, sekarang coba jalankan aplikasi dengan
membuka halaman view.php pada browser.
2. Kemudian ubah-lah salah satu data yang telah diinputkan dengan meng-
klik tombol edit pada daftar data user. Lihat Gambar 5.
![Page 21: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/21.jpg)
Gambar 5 Halaman Daftar Data User Akan Dilakukan Edit Record
Sebagai contoh pada Gambar 5, record no. 4 atas nama Balla Dewa Putra akan
dilakukan ubah data yaitu data Password dan No. HP.
![Page 22: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/22.jpg)
Gambar 6 Form Edit Data
Pada Gambar 6 form edit data
dilakukan ubah data Password dan
Nomor HP
![Page 23: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/23.jpg)
Gambar 7 Tampilan Halaman View Setelah Dilakukan Edit Data
![Page 24: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/24.jpg)
Hapus Data
1. Buat file baru dengan nama delete.php dan ketikkan kode script berikut :
<?php include('config.php'); $id = $_GET['id']; $query = mysql_query("delete from user where user_id='$id'") or die(mysql_error()); if ($query) { header('location:view.php?message=delete'); } ?>
2. Kemudian tambahkan baris script pada link dalam file view.php seperti
berikut :
<td> <a href="edit.php?id=<?php echo $data['user_id']; ?>">Edit</a> || <a href="delete.php?id=<?php echo $data['user_id']; ?>">Hapus</a> </td>
Perubahan script pada file view.php setelah ditambahkan baris script diatas,
dapat dilihat pada pembahasan / slide sebelumnya.
![Page 25: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/25.jpg)
3. Jalankan aplikasi dengan membuka halaman view.php pada browser.
4. Hapus-lah satu record data user pada daftar dengan meng-klik Hapus.
Gambar 8 Halaman Daftar Data User Akan Dilakukan Hapus Record
![Page 26: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/26.jpg)
Gambar 9 Halaman Daftar Data User Setelah Dilakukan Hapus Record
Pada Gambar 9, yang menunjukkan record nomor 4 atas nama Balla Dewa
Putra telah terhapus dari daftar data user.
![Page 27: OOP 171215](https://reader033.vdocuments.site/reader033/viewer/2022050820/5695d0e31a28ab9b02944985/html5/thumbnails/27.jpg)
SELAMAT MENTJOBA &
SALAM SOEKSES