2. Dasar-dasar PHP dan MySQL.pdf

Viewer
Transcript

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Dasar-dasar Pengolahan Database dengan PHP & MySQL Materi: Insert, Update, Delete, dan View Data (Select) STUDI KASUS: Membuat Aplikasi Sistem Informasi Kepegawaian Sederhana Sebelum Anda melanjutkan membaca dan mempraktekkan tutorial ini, ada baiknya menyimak beberapa screenshot/tampilan-tampilan halaman web yang akan disusun. 1. Tampilan Halaman Utama (index.php)

2. Tampilan Halaman Entry Pegawai (entry.php)

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 3. Tampilan Halaman View Pegawai (view.php)

4. Tampilan Halaman Update Data Pegawai (form_update.php)

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 5. Halaman Hapus Data Pegawai (form_hapus.php)

6. Tampilan Halaman About (about.php)

Setelah menyimak screenshot tersebut, selanjutnya Anda akan dituntun secara bertahap menyusun web Sistem Informasi Kepegawaian ini.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 1. Membuat File db.php File ini nantinya akan digunakan sebagai file konfigurasi/pengaturan koneksi ke MySQL Server dan membuka database. Diagram alir: Buat Koneksi ke MySQL Server

Buka Database

a. Perintah untuk membuat koneksi ke MySQL Server adalah dengan menggunakan perintah mysql_connect(“hostname”,”username”,”password”). Keterangan: 1) hostname adalah alamat server mysql (pada umumnya diisi localhost) 2) username adalah nama user di MySQL (pada umumnya diisi root) 3) password adalah kata kunci untuk mengakses MySQL b. Setelah perintah mysql_connect berhasil dijalankan, maka langkah selanjutnya adalah membuka database. Untuk membuka database, perintah yang digunakan adalah mysql_select_db(“database_name”). 1) database_name adalah nama database yang akan digunakan selama proses pengolahan data. Cara membuatnya adalah sebagai berikut: a. Klik menu File  New  General  Dynamic Page  PHP  Create

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] b. Aktifkan Mode CODE VIEW, dan hapus semua tag HTML yang ada.

Semua tag ini dihapus

Kemudian ketik script berikut berikut: 1 2 3 4 5 6

= mysql_connect("localhost","root","a") or die(mysql_error()); $bukadatabase = mysql_select_db("dbsimpeg") or die(mysql_error()); ?>

Script diatas dibuat di Dreamweaver 8 dengan mengaktifkan MODE CODE VIEW terlebih dahulu. Dengan mode CODE VIEW ini, maka seluruh script HTML maupun PHP akan tampil. Di Dreamweaver terdapat tiga MODE pembuatan halaman web, yaitu: 1. CODE VIEW: hanya menampilkan script saja (baik HTML maupun PHP). 2. SPLIT VIEW: menampilkan desain halaman web berupa Script dan Tampilan Visualnya. 3. DESIGN VIEW: menampilkan desain halaman web secara visual. Jangan lupa simpan script diatas dengan nama db.php. File db.php diatas akan selalu dipanggil di setiap halaman web yang membutuhkan pengolahan data, sehingga halaman web tersebut dapat terhubung dengan MySQL Server.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] Penjelasan Script: a. Baris 1 dan Baris 6, merupakan pasangan tag PHP yang disimbolkan dengan . b. Baris 2 sampai baris 3, membuat koneksi ke server MySQL dengan perintah mysql_connect. Apabila gagal terhubung maka muncul pesan kesalahannya (lihat pada statement: “die(mysql_error())”). c. Baris 4 sampai baris 5, apabila koneksi ke server berhasil, dilanjutkan dengan membuka database yaitu dbsimpeg (lihat pada statement: mysql_select_db). Dan apabila database gagal dibuka maka muncul pesan kesalahannya. 2. Membuat File header.php File ini digunakan untuk menampilkan banner halaman web, terletak di bagian atas halaman web. Cara membuatnya: a. Klik menu File  New  General  Dynamic Page  PHP  Create

b. Aktifkan Mode CODE VIEW, dan hapus semua tag HTML yang ada.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Semua tag ini dihapus

c. Aktifkan Mode DESIGN VIEW. d. Klik Menu INSERT  TABLE, atur sesuai gambar berikut:

Klik OK untuk menutup dialog. Hasilnya tampak pada gambar berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

e. Selanjutnya, perhatikan pada bagian bawah Dreamweaver, disitu terdapat Panel Properties. Property yang perlu diubah adalah ALIGN, yang pada awalnya DEFAULT, ubahlah menjadi CENTER.

f. Letakkan kursor mouse ke dalam table yang baru saja Anda buat. g. Klik menu INSERT  IMAGE, masuk ke folder c:\AppServ\www\Pelatihan\images, dan pilih file banner.jpg.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

h. Selanjutnya akan muncul dialog berikut:

Alternate text diisi dengan Header, Long description diabaikan saja, selanjutnya klik OK. i.

Hasil akhir akan tampak seperti gambar berikut:

j.

Simpan desain Anda dengan nama header.php.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 3. Membuat file menu.php File menu.php ini akan digunakan sebagai template menu yang akan muncul di semua halaman web. Cara pembuatannya adalah sebagai berikut: a. Buat file php baru. b. Aktifkan mode CODE VIEW. c. Hapus semua tag HTML yang ada. d. Kembali aktifkan mode DESIGN VIEW. e. Klik menu INSERT  TABLE, atur property-nya dan sesuaikan seperti tampak pada gambar berikut:

f.

Hasilnya adalah sebuah tabel dengan 4 baris dan 1 kolom tanpa border.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] g. Letakkan kursor mouse di dalam tabel, tepatnya pada baris pertama tabel. Selanjutnya klik INSERT  IMAGE, masuk ke folder images, dan pilih file home.jpg.

Selanjutnya muncul dialog Images Tag Accessibility Attributes, isi Alternate text dengan Home, abaikan Long description dan klik OK.

h. Hasilnya akan tampak seperti pada gambar berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] i.

j.

Selanjutnya Anda dapat mengulangi lagi langkah pada poin g diatas untuk memasukkan gambar ke dalam tabel. Sekarang silakan Anda coba sendiri: 1) Baris kedua tabel diisi dengan gambar entry.jpg 2) Baris ketiga tabel diisi dengan gambar view.jpg 3) Baris keempat tabel diisi dengan gambar about.jpg Hasil akhir akan tampak seperti pada gambar berikut:

k. Selesai, simpan desain Anda dengan nama menu.php. 4. Membuat Halaman Utama Web (index.php) Halaman utama sebuah web selalu bernama index.php atau index.html. Karena system yang akan Anda buat menggunakan php, maka nama file index menggunakan ekstensi / akhiran .php. File index.php inilah yang akan dimuat pertama kali ketika Anda mengakses alamat web Anda, misalnya: http://localhost/pelatihan. Jadi untuk membuka file index.php Anda tidak perlu menuliskan nama filenya di alamat webnya seperti http://localhost/pelatihan/index.php. Untuk membuatnya silakan ikuti langkah-langkah berikut: a. Buat sebuah file php baru. b. Aktifkan mode DESIGN VIEW. c. Buat sebuah tabel dengan property sebagai berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

d. Hasilnya akan tampak seperti gambar berikut:

e. Selanjutnya ubahlah Title halaman web Anda dari Untitled Document menjadi PT. Anugerah Abadi.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

f.

Selanjutnya, klik menu MODIFY  PAGE PROPERTIES.

g. Selanjutnya akan muncul dialog Page Properties, perhatikan pada bagian Background Image.

Klik Browse, dan masuk ke folder images, pilih file gambar bg.gif.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Apabila muncul dialog konfirmasi, tekan OK saja.

h. Selanjutnya Anda akan kembali ke dialog Page Properties sebelumnya, langsung klik OK.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] i.

Lihat hasilnya, background halaman web sudah terisi dengan gambar bg.gif.

j.

Langkah selanjutnya adalah mengatur property tabel. Klik pada border/bingkai luar tabel. Ubahlah property ALIGN agar menjadi CENTER.

Atur pula Property Bg Color, kemudian pilih warna putih.

k. Hasilnya adalah warna background tabel menjadi putih, perhatikan gambar berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

l.

Langkah selanjutnya, letakkan kursor mouse di baris ketiga pada tabel.

m. Klik menu Modify  Tables  Split Cell, atur property-nya menjadi 2 Columns atau sesuaikan dengan gambar:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Hasilnya adalah baris ketiga terbagi menjadi 2 kolom. n. Arahkan pointer mouse di pembatas antara dua kolom (tepat di tengah tabel), kemudian draglah ke arah kiri. Aturlah sehingga lebar pada kolom pertama baris ketiga tertera 240.

Kolom pertama baris ketiga akan memiliki lebar 240px.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] o. Selanjutnya, letakkan kursor mouse ke kolom pertama baris ketiga. Perhatikan pada panel Properties. Aturlah property Bg (background) dengan memilih file gambar bgtable.jpg.

Hasilnya adalah background kolom pertama baris ketiga pada tabel akan terisi dengan gambar bgtable.jpg.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

p. Selanjutnya adalah mengatur warna background baris kedua. Pada tabel, letakkan kursor mouse di baris kedua tabel.

Perhatikan pada panel Properties. Aturlah property Bg dengan memilih warna merah hati.

q. Selanjutnya adalah mengatur warna background baris keempat. Pada tabel, letakkan kursor mouse di baris keempat tabel.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Perhatikan pada panel Properties. Aturlah property Bg dengan memilih warna merah hati.

Hasilnya akan tampak seperti gambar berikut:

r.

Langkah selanjutnya adalah mengatur header web. Header web akan diletakkan pada baris pertama tabel. Header halaman web yang sudah dibuat (file header.php) akan disisipkan ke baris pertama tabel melalui script PHP. Untuk menyisipkannya, perintah yang diperlukan adalah include “namafile.php”. Letakkan kursor mouse pada baris pertama tabel. Segera saja aktifkan mode SPLIT VIEW (atau mode CODE VIEW). Perhatikan tampilan SPLIT VIEW, di bagian atas adalah Source / Kode HTML dan bagian bawah adalah tampilan visualnya.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Pada gambar diatas, perhatikan pula posisi kursor mouse Anda. Kalau di DESIGN VIEW, kursor mouse Anda berada di baris pertama tabel, sedangkan kalau di CODE VIEW, posisi kursor mouse Anda berada di antara tag dan , yaitu pada bagian Nah, disitulah nantinya script PHP akan disisipkan. Script PHP selengkapnya sebagai berikut: Script tersebut berfungsi untuk menyisipkan file “header.php” ke dalam dokumen web. Script tersebut ditempatkan di antara dengan menghapus teks , lihat gambar berikut ini:

Teks dihapus dan diganti dengan

Setelah itu, perhatikan Panel Properties, klik tombol Refresh dan perhatikan perubahan pada bagian DESIGN VIEW.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Hasilnya adalah pada DESIGN VIEW, tepatnya pada baris pertama tabel terdapat ikon PHP.

Proses penyisipan header.php sudah selesai. s. Langkah selanjutnya adalah menyisipkan file menu.php ke kolom pertama baris ketiga, caranya hampir sama dengan poin r diatas, Anda tinggal meletakkan kursor mouse ke kolom pertama baris ketiga (kolom yang memiliki warna background gradient merah putih), dan pada CODE VIEW / SPLIT VIEW perhatikan tempat kursor mouse Anda aktif, apabila terletak di antara tag maka disitulah script PHP ini akan diletakkan. Scriptnya adalah sebagai berikut: Detail penempatannya dapat dilihat pada gambar berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Klik Refresh. Dan hasilnya tampak seperti gambar berikut:

Atur pula property untuk kolom pertama baris ketiga khususnya pada bagian Horz dan Vert, Horz diatur menjadi LEFT, dan Vert diatur menjadi TOP.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] t.

Langkah terakhir adalah membuat Content di bagian tengah halaman web, tepatnya di kolom kedua baris ketiga.

Bloklah teks “PT. Anugerah Abadi”, kemudian atur pada Panel Properties-nya: 1) Align = Center 2) Font = Verdana 3) Size = 24 Pixel 4) Color = #990000 (merah maroon)

Atur pula untuk teks alamat perusahaan property yang diatur adalah sebagai berikut: 1) Align = Center 2) Font = Verdana 3) Size = 12 Pixel 4) Color = #990000 (merah maroon)

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] u. Simpan desain Anda dengan nama file: index.php. v. Coba jalankan web Anda: 1) Buka Mozilla Firefox atau Internet Explorer 2) Pada Address Bar, ketik http://localhost/pelatihan dan tekan ENTER. 3) Sekarang halaman index.php Anda sudah muncul, lihat gambar berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 5. Membuat Halaman Entry Data Pegawai (entry.php) Halaman Entry Data Pegawai ini akan digunakan sebagai antar-muka di dalam melakukan proses penyimpanan data pegawai. Halaman ini akan terdiri dari sebuah Form (Formulir) untuk pengisian data pegawai, seperti tampak pada gambar berikut:

Sebuah Form/formulir biasanya terdiri dari sebuah FORM dengan beberapa OBJECT seperti TEXTFIELD, BUTTON, OPTION, dsb.

Sebelum melanjutkan pembuatan halaman Entry Data Pegawai, Anda harus membuat database dbsimpeg dan tabel tbpegawai terlebih dahulu. Caranya adalah sebagai berikut: a. b. c. d.

Buka http://localhost/phpMyAdmin. Login dengan username “root” dan password “a” Klik ikon SQL di panel sebelah kiri. Beri perintah SQL berikut pada phpMyAdmin dan Klik GO: CREATE DATABASE dbsimpeg; USE dbsimpeg; CREATE TABLE tbpegawai ( nip char(10), nama varchar(60), alamat varchar(255), tempat_lahir char(40), tanggal_lahir char(10), jabatan char(30), bagian char(30) )

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] Selanjutnya setelah pembuatan database dan tabel berhasil, lanjutkan ke proses desain antar muka Entry Data Pegawai. Cara Pembuatannya adalah sebagai berikut: a. Buka file index.php yang sudah Anda buat tadi. b. Langsung lakukan SAVE AS dengan nama file entry.php. Klik menu File  Save AS  Beri nama File entry.php.

c. Setelah dokumen tersimpan dengan nama entry.php, Aktifkan Mode Design View, hapuslah teks PT. ANUGERAH ABADI beserta teks alamatnya, dan ganti dengan teks “ENTRY DATA PEGAWAI”.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] Atur pula pada Panel Properties: Font: Verdana Size: 16 pixels Color: #990000 d. Selanjutnya letakkan kursor mouse tepat dibawah teks ENTRY DATA PEGAWAI, kemudian buatlah FORM (Formulir) untuk melakukan entry data pegawai. Caranya sebagai berikut: 1) Klik menu INSERT  FORM  FORM Hasilnya adalah terdapat area FORM yang berwarna merah

2) Letakkan kursor di dalam form. Klik menu INSERT  TABLE, atur tabel tersebut agar memiliki kolom sebanyak 2 dan baris sebanyak 9 baris, lebar 90%.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

3) Atur ALIGN pada Panel Properties menjadi CENTER.

4) Letakkan kursor mouse ke kolom 1 baris 1. Ketiklah “No. Induk Pegawai”. 5) Letakkan kursor mouse ke kolom 2 baris 1. Klik menu INSERT  FORM  TEXTFIELD. Apabila muncul dialog, abaikan saja dengan klik CANCEL. 6) Kemudian perhatikan Panel Properties, ubahlah nama objek textfield menjadi txtnip.

7) Selanjutnya letakkan kursor mouse ke kolom 1 baris 2. Ketiklah “Nama Lengkap”. 8) Letakkan kursor mouse ke kolom 2 baris 2. Klik menu INSERT  FORM  TEXTFIELD. Apabila muncul dialog, abaikan saja dengan klik CANCEL. 9) Kemudian perhatikan Panel Properties, ubahlah nama objek textfield menjadi txtnama.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

10) Selanjutnya letakkan kursor mouse ke kolom 1 baris 3. Ketiklah “Alamat”. 11) Letakkan kursor mouse ke kolom 2 baris 3. Klik menu INSERT  FORM  TEXTAREA. Apabila muncul dialog, abaikan saja dengan klik CANCEL. 12) Kemudian perhatikan Panel Properties, ubahlah nama objek textarea menjadi textalamat, Char Width: 30 dan Num Lines: 5.

13) Selanjutnya letakkan kursor mouse ke kolom 1 baris 4. Ketiklah “Tempat Lahir”. 14) Letakkan kursor mouse ke kolom 2 baris 4. Klik menu INSERT  FORM  TEXTFIELD. Apabila muncul dialog, abaikan saja dengan klik CANCEL. 15) Kemudian perhatikan Panel Properties, ubahlah nama objek textfield menjadi txttempatlahir.

16) Selanjutnya letakkan kursor mouse ke kolom 1 baris 5. Ketiklah “Tanggal Lahir”. 17) Letakkan kursor mouse ke kolom 2 baris 5. Klik menu INSERT  FORM  TEXTFIELD. Apabila muncul dialog, abaikan saja dengan klik CANCEL. 18) Kemudian perhatikan Panel Properties, ubahlah nama objek textfield menjadi txttanggallahir.

19) Selanjutnya letakkan kursor mouse ke kolom 1 baris 6. Ketiklah “Jabatan”. 20) Letakkan kursor mouse ke kolom 2 baris 6. Klik menu INSERT  FORM  TEXTFIELD. Apabila muncul dialog, abaikan saja dengan klik CANCEL. 21) Kemudian perhatikan Panel Properties, ubahlah nama objek textfield menjadi txtjabatan.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

22) Selanjutnya letakkan kursor mouse ke kolom 1 baris 7. Ketiklah “Bagian”. 23) Letakkan kursor mouse ke kolom 2 baris 7. Klik menu INSERT  FORM  TEXTFIELD. Apabila muncul dialog, abaikan saja dengan klik CANCEL. 24) Kemudian perhatikan Panel Properties, ubahlah nama objek textfield menjadi txtbagian.

25) Selanjutnya, letakkan kursor mouse ke kolom 1 baris 9. Klik menu INSERT  FORM  BUTTON. 26) Perhatikan Panel Properties, ubahlah VALUE menjadi “Simpan”, dan Action pilih Submit Form.

27) Letakkan kursor di sebelah kanan tombol Simpan yang baru saja Anda buat, kemudian klik menu INSERT  FORM  BUTTON. 28) Atur propertynya, ubah VALUE menjadi “Reset” dan Action pilih Reset Form.

29) Kemudian, aturlah teks No. Induk Pegawai, Nama Lengkap, Alamat, dan seterusnya dengan aturan berikut: Font: Verdana Size: 12 pixels Color: #990000

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

30) Terakhir, Klik pada bagian border FORM sehingga Panel Properties muncul,

Bagian border warna merah putus-putus ini adalah penanda form

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] Perhatikan Panel Properties, isilah ACTION pada FORM dengan proses_simpan.php dan Method: POST.

31) Hasil akhir desain adalah sebagai berikut:

e. Setelah tahap desain selesai, selanjutnya adalah membuat script PHP yang akan menangani penyimpanan data yang dimasukkan melalui formulir Entry Data Pegawai tersebut. Langkahlangkah pembuatan scriptnya sebagai berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 1) Klik menu File  New  General  Dynamic Page  PHP  Create

2) Aktifkan Mode CODE VIEW, dan hapus semua tag HTML yang ada. 3) Kemudian ketiklah script berikut: 1
Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61

{ echo "

Semua data harus diisi lengkap

Kembali

"; exit; }

align='center'>
//mendefinisikan perintah SQL untuk validasi data //dimana tidak boleh ada duplikasi NIP $sql="select * from tbpegawai where nip = '$nip'"; //mengeksekusi perintah SQL validasi data $hasil=mysql_query($sql) or die(mysql_error()); //apabila ada NIP yang sama maka tampilkan pesan NIP sudah ada if(mysql_num_rows($hasil) > 0) { echo "

Nomor Induk Pegawai sudah ada di database!

Kembali

"; exit; }

align='center'>
//mendefinisikan perintah SQL untuk //penyimpanan data ke tabel tbpegawai $sql = "INSERT INTO tbpegawai (nip, nama, alamat, tempat_lahir, tanggal_lahir, jabatan, bagian) VALUES ('$nip', '$nama', '$alamat', '$tempatlahir', '$tanggallahir', '$jabatan', '$bagian')"; //mengeksekusi perintah SQL agar data tersimpan ke database $hasil = mysql_query($sql) or die(mysql_error());

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 62 63 //menampilkan pesan bahwa penyimpanan data berhasil 64 echo "

Penyimpanan data berhasil! 67

Kembali

"; 69 ?> Selanjutnya simpan dengan nama file proses_simpan.php.

Keterangan Script: a) Baris 1 dan 69 adalah pasangan Tag PHP. b) Baris 4, memanggil semua perintah yang ada di file db.php, yaitu perintah melakukan koneksi ke MySQL Server dan membuka database dbsimpeg. c) Baris 9 sampai 15, perintah untuk mengambil data yang diisi melalui Form (formulir), khususnya data yang dimasukkan di TEXTFIELD dan TEXTAREA menggunakan method POST. d) Baris 17 sampai 30 adalah proses validasi dari data kosong (maksudnya semua isian yang ada di formulir wajib diisi)  menggunakan perintah empty(). e) Baris 32 sampai 51 adalah proses validasi dari data yang sama untuk menghindari terjadinya duplikasi data khususnya NIP (menggunakan perintah SQL SELECT). f) Baris 53 sampai 58, mendefinisikan perintah SQL untuk penyimpanan data ke tabel (menggunakan perintah SQL INSERT INTO).

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] g) Baris 61 adalah proses eksekusi perintah SQL yang didefiniskan sebelumnya (proses penyimpanan data ke tabel tbpegawai)  menggunakan perintah mysql_query(). h) Baris 63 sampai 68 adalah menampilkan pesan bahwa penyimpanan data berhasil dilakukan. 4) Selesai, ujicobalah menggunakan Mozilla Firefox atau Internet Explorer, ketik di address bar: http://localhost/pelatihan/entry.php

Isilah dengan beberapa data:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

5) Untuk menguji apakah data sudah benar-benar tersimpan atau tidak, bukalah http://localhost/phpMyAdmin. Masukkan username dan Password untuk login.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 6) Pilih Database dbsimpeg, sehingga muncul tabel tbpegawai lalu klik tabel tbpegawai tersebut, dan klik BROWSE.

3

1

2

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 7) Perhatikan apakah sudah ada data yang ditampilkan di bagian bawah phpMyAdmin.

8) Apabila data yang Anda isi sudah tampil berarti proses penyimpanan data Anda berhasil. 6. Membuat Script PHP untuk Menampilkan Data Yang Sudah Tersimpan (view.php) Halaman ini digunakan untuk menampilkan data yang sudah tersimpan di database. Data yang ditampilkan untuk selanjutnya dapat diupdate (edit/koreksi) maupun dihapus. Tampilan halaman view.php yang akan dibuat adalah sebagai berikut:

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Selanjutnya untuk membuat halaman view.php tersebut langkah-langkahnya adalah sebagai berikut: a. Buka file index.php b. Langsung Save-As dengan nama view.php. c. Aktifkan mode DESIGN VIEW. d. Hapus teks PT. Anugerah Abadi dan alamatnya.

Teks dihapus

e. Setelah terhapus, klik mode SPLIT VIEW. f. Perhatikan letak kursor mouse, harus diantara tag

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] g. Sisipkan script berikut di tempat kursor mouse berada (dengan menghapus ) 1 VIEW DATA 4 PEGAWAI"; 5 6 //mendefinisikan perintah SQL untuk mengambil data dari tabel tbpegawai 7 $sql = "select * from tbpegawai"; 8 9 //mengeksekusi perintah sql 10 $hasil=mysql_query($sql) or die(mysql_error()); 11 12 //apabila ada datanya, maka tampilkan 13 if(mysql_num_rows($hasil) > 0) 14 { 15 //membuat tampilan tabel beserta kolom-kolomnya tempat data ditampilkan 16 echo " 18 19 20 21 22 23 24 25 26 "; 27 28 //mulai menuliskan data yang diambil dari hasil query tbpegawai 29 //dari baris pertama sampai baris terakhir 30 //disesuaikan dengan masing-masing kolomnya. 31 while($kolom=mysql_fetch_array($hasil)) 32 { 33 echo " 34 35 36 37 38 39 40

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55

"; } echo "

NIP	Nama	Alamat	Tempat Lahir	Tanggal Lahir	Jabatan	Bagian	Aksi
$kolom[nip]	$kolom[nama]	$kolom[alamat]	$kolom[tempat_lahir]	$kolom[tanggal_lahir]	$kolom[jabatan]	$kolom[bagian]	href='form_update.php?nip={$kolom[nip]}&nama={$kolom[nama]} &alamat={$kolom[alamat]}&tempat_lahir={$kolom[tempat_lahir]} &tanggal_lahir={$kolom[tanggal_lahir]} &jabatan={$kolom[jabatan]} &bagian={$kolom[bagian]}'>Edit Hapus

"; } ?>

h. Selanjutnya, jangan lupa pada baris pertama script HTML (diatas tag ) sisipkan script berikut: i. Simpan file tersebut. j. Apabila script diatas dijalankan, maka akan muncul data pegawai yang sudah tersimpan. k. Cara menjalankan, buka firefox, ketik http://localhost/pelatihan/view.php 7. Membuat Halaman Update Data (form_update.php) Halaman update data ini akan ditampilkan ketika link EDIT di halaman view.php di klik. Cara membuatnya sama dengan langkah 6 diatas, yaitu: a. Buka file index.php. b. Langsung Save As dengan nama form_update.php c. Kemudian hapus teks PT. Anugerah Abadi dan alamatnya. d. Hapus teks PT. Anugerah Abadi dan alamatnya.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Teks dihapus

e. Setelah terhapus, klik mode SPLIT VIEW. f. Perhatikan letak kursor mouse, harus diantara tag

g. Sisipkan script berikut di tempat kursor mouse berada (dengan menghapus ) 1 YAKIN DATA AKAN DIUPDATE?

"; 13 echo "

"; ?>

h. Selanjutnya, jangan lupa pada baris pertama script HTML (diatas tag ) sisipkan script berikut: i. Simpan file tersebut. j. Apabila script diatas dijalankan, maka akan muncul data pegawai yang sudah tersimpan. k. Cara menjalankan, buka firefox, ketik http://localhost/pelatihan/view.php, kemudian klik link EDIT. 8. Membuat File Pemroses Update Data (proses_update.php) File proses_update.php ini adalah file yang akan dieksekusi/dijalankan ketika tombol SIMPAN di FORMULIR UPDATE data diklik. Cara membuatnya adalah sebagai berikut: a. Buat file baru b. Aktifkan mode CODE VIEW. c. Hapus semua tag HTML yang ada. d. Beri script berikut: 1
Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

$tempat_lahir = $_POST[texttempat_lahir]; $tanggal_lahir = $_POST[texttanggal_lahir]; $jabatan = $_POST[textjabatan]; $bagian = $_POST[textbagian]; //mendefinisikan perintah SQL untuk update data $sql = "update tbpegawai set nip = '$nipbaru', nama = '$nama', alamat = '$alamat', tempat_lahir = '$tempat_lahir', tanggal_lahir = '$tanggal_lahir', jabatan = '$jabatan', bagian = '$bagian' where nip = '$niplama'"; //mengeksekusi perintah SQL $hasil = mysql_query($sql) or die(mysql_error()); //apabila berhasil diupdate echo "

color='blue'

face='verdana'>Update

data

Kembali

"; ?>

e. Simpan file tersebut dengan nama proses_update.php. f. Ujicobalah update data dengan menjalankan http://localhost/pelatihan/view.php, kemudian klik link EDIT, silakan lakukan perubahan dan klik SIMPAN. Lihat perubahan yang terjadi. 9. Membuat Halaman Hapus Data (form_hapus.php) Halaman hapus data ini akan ditampilkan ketika link HAPUS di halaman view.php di klik. Cara membuatnya sama dengan langkah membuat form_update.php diatas, yaitu: a. Buka file index.php. b. Langsung Save As dengan nama form_hapus.php c. Kemudian hapus teks PT. Anugerah Abadi dan alamatnya. d. Hapus teks PT. Anugerah Abadi dan alamatnya.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected]

Teks dihapus

e. Setelah terhapus, klik mode SPLIT VIEW. f. Perhatikan letak kursor mouse, harus diantara tag

g. Sisipkan script berikut di tempat kursor mouse berada (dengan menghapus ) 1 YAKIN DATA AKAN DIHAPUS?

Penghapusan data berhasil!

Kembali

"; ?>

e. Simpan file tersebut dengan nama proses_hapus.php. f. Ujicobalah hapus data dengan menjalankan http://localhost/pelatihan/view.php, kemudian klik link HAPUS, silakan lakukan penghapusan data dengan klik HAPUS. 11. Membuat Halaman about.php Halaman ini menampilkan informasi pembuat web. Langkah-langkahnya adalah sebagai berikut: a. Buka file index.php b. Langsung Save As dengan nama about.php c. Aktifkan mode DESIGN VIEW d. Hapuslah teks PT. Anugerah Abadi dan alamatnya, kemudian diganti dengan teks berikut: Web Sistem Informasi Kepegawaian Dibuat Oleh: Wakidi Singadimedja

12. Mengintegrasikan halaman web dengan menu File-file yang sudah dibuat, dapat diintegrasikan dengan system menu dengan cara menambahkan link.

Chairullah Naury – HP: 085642270714 – YM & FB: [email protected] Langkah-langkahnya sebagai berikut: a. Buka file menu.php, aktifkan mode DESIGN VIEW

b. Klik gambar HOME. c. Perhatikan pada panel properties, pada bagian LINK diisi dengan index.php.

d. Kemudian beri link pula pada: 1) Gambar Entry Data Pegawai diberi link entry.php 2) Gambar View Pegawai diberi link view.php 3) Gambar About diberi link about.php ===Selesai untuk materi dasar-dasar PHP dan MySQL=== ===Silakan web ini diujicoba di http://localhost/pelatihan/===

Budi-Aplikasi-CRUD-Sederhana-Dengan-PHP-dan-MySql.pdf ...