Tutorial Membuat Sistem Informasi Kepegawaian Berbasis MySQL dan Dreamweaver untuk Pemula

Tutorial Membuat Sistem Informasi Kepegawaian Berbasis MySQL dan Dreamweaver untuk Pemula

Oleh: Dwi Yulianto

Seluruh isi dalam dokumen ini dapat digunakan, dimanfaatkan dan disebarluaskan secara bebas untuk tujuan pendidikan, pembelajaran dan bukan komersial (non profit), dengan syarat tidak menghilangkan, menghapus atau mengubah atribut penulis dokumen ini dan pernyataan dalam lisensi dokumen. Tidak diperbolehkan melakukan penulisan ulang atau mengkomersialkan buku ini kecuali mendapatkan ijin dulu dari penulis.

Daftar Isi HALAMAN JUDUL --------------------------------------------------------------------------------------- 1 DAFTAR ISI ----------------------------------------------------------------------------------------------- 2 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. 27. 28.

Membuat Database Baru ------------------------------------------------------------------------- 3 Membuat Site baru -------------------------------------------------------------------------------- 7 Koneksi Dreamweaver dan MySQL ----------------------------------------------------------- 11 Memulai Halaman Baru ------------------------------------------------------------------------- 13 Membuat Form Login---------------------------------------------------------------------------- 14 Membuat Input Data ---------------------------------------------------------------------------- 21 Membuat Home User---------------------------------------------------------------------------- 30 Membuat Restrict Halaman -------------------------------------------------------------------- 37 Membuat Menu Logout ------------------------------------------------------------------------- 39 Membuat Menu Pembuka---------------------------------------------------------------------- 40 Membuat Halaman Ubah Password ---------------------------------------------------------- 42 Membuat Halaman Show Data ---------------------------------------------------------------- 47 Membuat Halaman Update Data-------------------------------------------------------------- 51 Uji Coba (Bagian 1) ------------------------------------------------------------------------------- 56 Membuat Halaman Login Admin -------------------------------------------------------------- 62 Membuat User Management ------------------------------------------------------------------ 67 Membuat Repeat Region ----------------------------------------------------------------------- 70 Membuat Show Data Admin ------------------------------------------------------------------- 71 Membuat Edit Data Admin --------------------------------------------------------------------- 74 Membuat Delete Data --------------------------------------------------------------------------- 77 Setting User Management ---------------------------------------------------------------------- 78 Membuat Halaman Ubah Password ---------------------------------------------------------- 84 Uji Coba (Bagian 2) ------------------------------------------------------------------------------- 89 Membuat Upload File dan Galeri-------------------------------------------------------------- 94 Uji Coba (Bagian 3) ------------------------------------------------------------------------------ 106 Membuat Gallery Administrator ------------------------------------------------------------- 108 Uji Coba (Bagian 4) ------------------------------------------------------------------------------ 112 Tentang Penulis ---------------------------------------------------------------------------------- 115

Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 2

Pada tutorial kali ini saya asumsikan bahwa.. Di komputer yang Anda gunakan sudah terinstall dengan baik PHP, Apache, MySQL dan Macromedia Dreamweaver karena dalam tutorial ini kita akan menggunakan keempat software tersebut. Anda mengetahui bagaimana cara login ke MySQL berikut informasi user dan password yang dapat digunakan.

Membuat Database 1) Pertama pastikan service dari Apache,MySql dan FileZilla dalam keadaan running seperti gambar di bawah ini.

2) Buka Dreamweaver dan browser 3) Pada address bar ketikkan http://localhost/phpmyadmin. 4) Buat database baru untuk memulai membuat Sistem Informasi Kepegawaian.beri nama dengan db_peg atau yang lain terserah anda.


Halaman 3

5) Lalu klik Create. 6) Langkah selanjutnya adalah membuat table.disini saya membuat 2 tabel terlebih dahulu yaitu table admin dan table data. 7) Buat table admin dan isi berapa banyak field nya.

8) Isi field seperti gambar di bawah ini.

Untuk Level defaultnya isikan dengan angka 0 (nol). 9) Jangan lupa pada id kita centang pada Auto Increment agar data otomatis terurutkan.


Halaman 4

10) Setelah itu klik Save dan muncul seperti gambar di bawah ini.

11) Langkah selanjutnya buat table satu lagi beri nama dengan data.

12) Lalu kemudian klik Go. 13) Tampilannya seperti gambar di bawah ini,isi sesuai dengan kebutuhan.


Halaman 5

Pada level jangan lupa mengaturnya dengan “As defined” dan isikan dengan angka 1 (satu) Karena ini berbeda level dengan admin yang tadi telah dibuat. 14) Setelah di save muncul konfirmasi seperti gamabr di bawah ini.


Halaman 6

Membuat Site Baru

1) Setelah itu kita beralih ke Dreamweaver. 2) Buka Dreamweaver lalu klik menu Site untuk mengatur Site sebelum kita memulai bekerja dengan Dreamweaver.

3) Klik New untuk membuat Site baru. 4) Beri nama misalnya dengan “Pegawai” Local root folder isi dengan alamat dimana “project” yang sedang kita garap. Default images folder menunjukkan dimana tempat penyimpanan gambar untuk project kita.biasanya berada di subfoldernya (../Pegawai/Images) Untuk HTTP address isikan sama dengan Local root folder.


Halaman 7

5) Pada remote Info pilih Access = Local/Network Pada Remote folder isikan sesuai dengan gambar di bawah ini.

6) Lalu pada Testing Server isikan Server model dengan PHP MySQL Access nya Local/Network Testing server folder isikan sesuai dengan gambar di bawah ini Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 8

Untuk URL prefic diisi sama seperti Testing server folder.

7) Klik OK untuk melanjutkan. 8) Site Pegawai telah dibuat.


Halaman 9

9) Klik Done 10) Jika masih terdapat error coba lagi seperti cara di atas.


Halaman 10

Koneksi Dreamweaver dan MySQL

Sekarang waktunya membuat koneksi antara Dreamweaver dengan memanfaatkan tools yang sudah tersedia di Macromedia Dreamweaver. Jangan lupa pastikan bahwa Site Definition di Dreamweaver sudah dibuat dengan benar, karena keberhasilan dari koneksi ke MySQL juga bergantung dari site definition tersebut 1) Klik tanda (+) Plus pada Application

Databases

2) Klik MySQL Connection 3) Isikan sesuai gambar di bawah ini.

4) Default username adalah root dan passwordnya kosong. 5) Klik select untuk memilih database 6) Pilih nama database yang tadi dibuat lalu klik OK.


Halaman 11

7) Sekarang Dreamweaver dan MySQL telah berhasil terkoneksi


Halaman 12

Membuat Halaman Baru

Sekarang buat tempilan web dinamis (berekstensi PHP) lalu desainlah sesuai dengan gaya masing-masing. 1) Simpanlah dengan nama index.php pada folder ../xampp/htdocs/pegawai. 2) Halaman itu nantinya akan menjadi halaman utama pada saat di browser diketikkan http://localhost/pegawai 3) Tempilannya kurang lebih seperti berikut ini.

4) Jangan lupa save as lah index.php menjadi register.php,news.php,about.php dan help.php 5) Jangan lupa beri judul (Title) 6) Buka kembali ke index.php


Halaman 13

Membuat Form Login

1) Buat form login untuk login pegawai. 2) Buat table baru dengan 2 kolom dan 4 baris lalu aturlah sedemikian rupa seperti gambar di bawah ini(gunakan fasilitas Merge Center). 3) Beri judul dengan Login Pegawai

4) Untuk Username dan Password menggunakan Text Field dengan cara:


Halaman 14

5) Untuk menambahkan tombol login atau reset lihat gambar berikut.


Halaman 15

6) Beri nama dengan Login

7) Jangan lupa pada TextField properties isikan dengan username untuk textfield username dan isikan password untuk textfield password.


Halaman 16

8) Untuk TextField password jangan lupa mengubahnya ke mode “password” agar setiap karakter yang diketik muncul bulatan-bulatan. 9) Untuk mengaktifkan form login dengan cara menambahkan User Authentication


Log In User

Halaman 17

10) Isikan seperti gambar di bawah ini.

11) Menggunakan table data dengan Username dan password Column seperti di atas Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 18

Setelah login sukses maka akan diarahkan ke halaman user_home.php dan jika login aggal maka akan diarahkan ke user_failed.php. Untuk pengaturan restrict menggunakan username dan password 12) Setelah itu klik OK 13) Form Login telah aktif

14) Untuk mempercantik Form Login maka tambahkan Place Holder dengan cara klik TextField pada Username kemudian klik tombol Quick Tag Editor dan tambahkan sehingga menjadi seperti gambar.

15) Lakukan hal yang sama pada TextField Password


Halaman 19

16) Tampilan pada browser seperti gambar ini.


Halaman 20

Membuat Input Data

1) Hubungkan kata disini dengan halaman register.php (save as index.php menjadi register.php)

2) Hubungkan kata Administrator? Dengan halaman admin/admin_login.php (untuk login administrator).


Halaman 21

3) Save As index.php menjadi register.php

4) Setelah koneksi ke database MySQL berhasil dilakukan, maka selanjutnya kita akan membuat halaman untuk melakukan input data pegawai ke database MySQL. Pada dasarnya untuk membuat aplikasi input data, kita harus membuat form inputan terlebih dahulu. Namun dengan


Halaman 22

bantuan Macromedia Dreamweaver, kita akan memanfaatkan fasilitas yang sudah tersedia, sehingga tidak perlu membuat form terlebih dahulu 5) Hapus semua pada bagian body. 6) Kita akan membuat RecordSet terlebih dahulu. 7) Klik tanda (+) Plus pada Server Behaviors lalu pilih Recordset 8) Beri nama Recordset kita dengan menggunakan koneksi pegawai dan table data. 9) Pilih Column = All,Filter = None,dan Sort = None

10) Klik OK.satu recordset telah dibuat. 11) Kita akan membuat form untuk pendaftaran (input/insert) 12) Klik menu Insert

Application Objects

Insert Record

Insert Record From Wizard


Halaman 23

13) Isikan setelah memasukkan data akan diarahkan ke sukses_register.php?file=uploaded


Halaman 24

Id dihilangkan Username dan Password disembunyikan (Hidden Field) Level dihidden dan diisi default value dengan 1 (satu) Untuk Jenis kelamin Display As radio Group dengan pengaturan sebagai berikut

Untuk Alamat Display As Text Area 14) Setelah selesai klik OK dan akan muncul tampilan seperti gambar di bawah ini Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 25

15) Pada Foto klik TextField dan hapus lalu diganti dengan FileField dengan cara klik Insert

Form

File Field lalu beri nama field tersebut dengan foto.

16) Klik Show Code View lalu cari if ((isset($_POST["MM_insert"])) && ($_POST["MM_insert"] == "form1")) {

17) Setelah ketemu tambahkan script di bawah ini $target = "upload_foto/"; //hasil upload mau ditaruh dimana???// $target = $target . basename( $_FILES['foto']['name']);

upload_foto adalah folder dimana hasil upload foto diletakkan.


Halaman 26

Ubah ($_POST [‘foto’], “text”)) menjadi ($_FILES[‘foto’][‘name’],

18)

“text”))

19) Lalu tambahkan script ini dibawahnya. if(move_uploaded_file($_FILES['foto']['tmp_name'], $target)) {

20) Cari header(sprintf("Location: %s", $insertGoTo)); lalu tambahkan script ini dibawahnya }else{ header(sprintf("Location: failed_register.php?file=error")); }


Halaman 27

21) Untuk mendesain lebih lanjut kita bisa membuat link css di setiap halaman agar mempermudah kita dalam mendesain tampilan tanpa mengubahnya satu persatu.

22) Editlah form register seperti gambar di bawah ini (optional.wkwkwk)

23) Tampilan pada browser


Halaman 28


Halaman 29

Membuat User Home

1) Save As index.php menjadi user_home.php seperti gambar di bawah ini.

2) Lalu buat sebuah Recordset baru


Halaman 30

3) Beri nama Recordset tadi dengan nama misalnya rsHome Pada filter lihat seperti gambar di bawah ini.

4) Sebuah Recordset telah dibuat


Halaman 31

5) Buat sebuah kata-kata yang menujukkan kalau user telah Login

6) Masuk ke Mode Bindings lalu pilih nama dan Drag (seret) dan lepaskan seperti pada gambar.ini menunjukkan nantinya nama bersifat dinamis. 7) Buat script php yang menujukkan Hari dan tanggal


Halaman 32

$namabulan = array("","Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus ","September","Oktober","November","Desember"); echo $namahari[date("w")].", ".date("j")." ".$namabulan[date("n")]." ".date("Y");?>

8) Buat table baru dengan 7 baris dan 2 kolom untuk Menu.

9) Hasilnya seperti gambar di bawah ini.


Halaman 33

10) Insert gambar dan text untuk menu agar lebih serasi

11) Pilih file gambar yang akan digunakan


Halaman 34

12) Menu Home telah selesai dibuat

13) Lakukan pada semua baris dan kolom hingga seperti gambar di bawah ini.


Halaman 35


Halaman 36

Membuat Restrict Halaman

1) Agar yang dapat mengakses seuatu halaman beserta isinya hanyalah memberi yang terdaftar maka perlu dibuat sebuah restrict dengan cara

2) Apabila seseorang mencoba mengakses tanpa mempunyai hak akses maka akan diarahkan ke halaman forbidden.php

3) Tampilannya seperti di bawah ini


Halaman 37

4) Hubungkan (beri link) Home dengan user_home.php Show Data dengan user_data.php Edit Data dengan user_edit.php My Files dengan user_files.php Forum dengan user_forum.php News dengan user_news.php Logout dengan authentication logout Semua halaman sudah terinclude restrict.


Halaman 38

Membuat Menu Logout

1) Untuk memberikan sebuah Authentication Logout dengan cara menyeleksi dahulu kata logout lalu klik (+)

User Authentication

Log Out User

2) Isikan halaman ketika logout sukses


Halaman 39

Membuat Menu Pembuka

1) Buatlah sebuah kalimat pembuka pada saat User berhasil login.misalnya seperti di bawah ini

2) Untuk membuat nama menjadi dinamis maka lakukan drag pada nama seperti gambar di atas. 3) Tambahkan gambar foto dari user yang login agar terlihat lebih ng-jreng.

4) Fotonya masih statis.kita akan buat menjadi dinamis 5) Drag foto ke dalam sembarang tempat pada project Dreamweaver lalu pilih mode split untuk melihat sumber code.nah setelah didapat source code dari foto tersebut maka Cut lah.


Halaman 40

6) Kembali pada foto statis tadi 7) Klik foto lalu pada src(source) masukkan upload_foto/

8) Maka gambar tadi akan berubah.lihat gambar


Halaman 41

Membuat Halaman Ubah Password

1) Untuk menambahkan fasilitas mengedit username dan password maka buatlah halaman dengan alamat user_ubah_password.php (untuk mengedit username dan password) dan user_konfirmasi.php (untuk konfirmasi data terbaru) 2) Buka halaman user_ubah_password.lalu buat sebuah Recordset

3) Setelah itu pilih Insert Record From Wizard


Halaman 42

4) Semua field di hidden field kecuali username dan password. 5) Setelah klik OK maka tampilannya seperti gambar di bawah ini.

6) Llau buka halaman user_konfirmasi.php lalu buat table seperti di bawah ini.untuk menampilkan foto sudah saya jelaskan sebelumnya.


Halaman 43

7) Setelah itu klik save. 8) Buka user_home.php tambahkan link untuk menuju ke user_ubah_password.php

9) Pilih user_ubah_password.php lalu klik parameter nya


Halaman 44

10) Pada Name isikan id dan pada value nya pilih id.lihat gambar


Halaman 45

11) Klik OK


Halaman 46

Membuat Halaman Show Data

1) Langkah selanjutnya adalah membuka hasil save as yaitu user_data.php 2) Pada halaman user_data.php buat Recordset baru

3) Setelah itu buat sebuah table dengan rincian sebagai berikut


Halaman 47

4) Ubah Align menjadi center. 5) Setelah itu ubahlah table tadi menjadi lebih menarik missal seperti gambar di bawah ini.termasuk gambar kosongan yang nantinya untuk foto setiap member


Halaman 48

6) Seperti yang telah di bahas sebelumnya.lakukan drag drop dari Bindings Recordset menuju ke kolom dan baris yang inginkan.

7) Untuk foto terlebih dahulu drag ke sembarang tempat,ambil source code nya lalu masukkan pada src gambar.lihat gambar di bawah ini.


Halaman 49

8) Kalau sudah selesai di simpan


Halaman 50

Membuat Halaman Update Data

1) Untuk selanjutnya adalah membuat sebuah form untuk mengedit data. 2) Buka user_edit.php lalu buat sebuah Recordset

3) Lalu menambahkan Update Record From Wizard


Halaman 51

4) Untuk id dihilangkan Untuk username,password,dan level di hidden field.klik OK


Halaman 52

5) Maka akan terbentuk seperti gambar di bawah ini.

6) Karena disini juga mengupdate foto maka pengaturan lebih lanjut diperlukan 7) Hapus textField ada foto untuk digantikan dengan FileField.lalu filefield name beri nama dengan foto Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 53

8) Ubah ke Mode Code 9) Cari if ((isset($_POST["MM_update"])) && ($_POST["MM_update"] == "form2")) {

10) Lalu tambahkan script ini dibawahnya $target = "upload_foto/"; //This is the directory where file will be uploaded// $target = $target . basename( $_FILES['foto']['name']);

Pastikan folder ini sama dengan folder waktu pendaftaran user 11) Kemudian tambahkan if(move_uploaded_file($_FILES['foto']['tmp_name'], $target))

{


Halaman 54

12) Setelah di update berhasil akan dibawah ke user_data.php?file=uploaded dan jika gagal akan dibawa ke user_data.php?file=error 13) Setelah itu di save


Halaman 55

Uji Coba (Bagian 1)

1) Sekarang melakukan percobaan dengan mendaftarkan user baru.

2) Klik register 3) Isikan data kalau sudah klik Register


Halaman 56

4) Pendaftaran user baru sukses dan bisa untuk login

5) Login dengan username dan password yang telah didaftarkan Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 57

6) Tampilan pembuka setelah berhasil login

7) Untuk menampilkan biodata user klik Show Data


Halaman 58

8) Untuk mengedit data klik Edit Data.

9) Misal saya mengedit menjadi Dwi Yulianto Is The Best dengan Tempat Lahir dan Alamat diganti dengan Yogyakarta.


Halaman 59

10) Maka tampilan setelah di edit menjadi seperti gambar di bawah ini.

11) Untuk mengubah username dan password masuk ke user_home.php dan klik Ubah Password?


Halaman 60

12) Ketikkan username atau password yang baru

13) Username atau password telah berhasil di ubah.


Halaman 61

Membuat Halaman Login Admin

1) Untuk admin saya masukkan halaman-halamannya di folder admin

2) Buat sebuah halaman baru untuk login admin.lalu buat table untuk form loginnya

3) Tampillannya kira-kira seperti ini.


Halaman 62

4) Dengan sedikit perubahan hingga menjadi seperti ini.

5) Jangan lupa TextField nya masing-masing di beri nama username dan password. 6) Buat Log In User seperti gambar.


Halaman 63

7) Kali ini menggunakan table admin


Halaman 64

8) Setelah selesai kira-kira seperti di bawah ini.

9) Jika login berhasil maka akan dibawa ke admin_home.php dan jika gagal akan muncul seperti ini.


Halaman 65

10) Buka admin_home.php sedemikian rupa dan jangan lupa untuk membuat Restrict sesuai dengan penjelasan sebelumnya.kemudian Save As dari user_home.php menjadi: admin_user_mgmt.php admin_web_mgmt.php admin_gallery_mgmt.php admin_file_mgmt.php admin_news_mgmt.php admin_show_user.php admin_edit_user.php


Halaman 66

Membuat User Management

1) Setelah selesai lalu buka admin_user_mgmt.php dan buat sebuah table seperti gambar di bawah ini.

2) Setelah itu akan tampil tabelnya.


Halaman 67

3) Hiaslah table tersebut hingga kira-kira seperti ini.

4) Tambahkan gambar dan keterangan.

5) Buat sebuah Recordset baru dengan nama rsAdminShowUser

6) Klik OK kalau sudah.lalu buka mode Bindings dan lakukan drag drop Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 68


Halaman 69

Membuat Repeat Region

1) Seleksi satu baris paling bawah.lalu buka mode Server Behaviors dan klik (+)

Repeat Region

2) Pilih All records lalu klik OK.

3) Tampilannya seperti di bawah ini.


Halaman 70

Membuat Show Data Admin

1) Untuk selanjutnya buka halaman admin_show_user.php lalu buat tabel dengan rincian sebagai berikut.

2) Lalu buat sebuah Recordset beri nama rsShowAdminUser.Filter yang dipakai adalah id


Halaman 71

3) Tabel yang dibuat kirakira seperti ini.tinggal di permak pakai sentuhan CSS.

4) Klik menuju ke Bindings.lalu drag Recordset tadi ke kolom dan baris yang sesuai. Untuk foto lakukan seperti pada saat penjelasan saya sebelumnya.


Halaman 72

5) Setelah itu save halaman admin_show_user.php


Halaman 73

Membuat Edit Data Admin

1) Selanjutnya buka admin_edit_user.php untuk membuat form pengeditan. 2) Buat Recordset lagi dengan nama rsAdminEditUser.filter yang digunakan adalah id

3) Buat update record dengan cara:


Halaman 74

4) Aturlah sedemikian rupa sehingga muncul tampilan seperti di bawah ini.


Halaman 75

5) Save halaman admin_edit_user.php


Halaman 76

Membuat Detele Data

1) Buat sebuah halaman delete_user.php (save as dari admin_home.php) 2) Pada halaman tersebut buatlah delete record

3) Lakukan pengaturannya seperti di bawah ini.setelah ada perintah delete maka akan kembali ke admin_user_mgmt.php


Halaman 77

Setting User Management

1) Setelah semuanya di save,kembalilah ke admin_user_mgmt.php untuk pengaturan lebih lanjut.seleksi kata Show lalu beri link.lihat gambar

2) Saya akan hubungkan dengan halaman admin_show_user.php tetapi saya perlu mengatur parameternya terlebih dahulu.


Halaman 78

3) Kemudian pada Name isikan id dan pada value nya pilihlah id.klik OK


Halaman 79

4) Setelah selesai giliran kata Edit diseleksi kemudian dihubungkan dengan admin_user_edit.php

5) Atur parameternya juga.


Halaman 80

6) Pada Name isikan id dan pada value pilihlah id.lihat gambar.klik OK

7) Dan yang selanjutnya adalah menyeleksi kata Delete untuk di hubungkan dengan halaman admin_delete_user.php


Halaman 81

8) Pilih admin_delete_user.php dan atur parameternya

9) Untuk Name pilih id dan pada Value pilih id. 10) Masih di admin_user_mgmt,saya ingin membuat setiap foto berbeda tiap user.maka lakukan seperti pada langkah-langkah sebelumnya. Sistem Informasi Kepegawaian Berbasis Dreamweaver dan MySQL untuk Pemula

Halaman 82

11) Klik foto,drag pada sembarang tempat.lalu buka Code View dan Cut code script PHPnya. 12) Klik foto 35px X 35px lalu atur menjadi dinamis.


Halaman 83

Membuat Halaman Ubah Password

1) Untuk menambah fasilitas ubah username dan password langkah-langkahnya sebagai berikut.

2) Buat kata-kata misalnya Ganti User Password. 3) Buat halaman pengeditan username dan password dan halaman konfirmasi perubahan yang dilakukan. 4) Buka halaman admin_edit_password.php lalu buat sebuah Recordset dengan nama rsAdminUbahPassword.filter yang digunakan adalah id

5) Buat Update Record From Wizard


Halaman 84

6) Lalu sembunyikan semua field kecuali username dan password


Halaman 85

7) Tampilan pada Dreamweaver

8) Selanjutnya adalah membuka admin_password_berhasil.php alu buat sebuah Recordset baru seperti berikut ini.


Halaman 86

9) Pengaturan filter adalah id 10) Langkah selanjutnya adalah membuat tabel baru seperti gambar di bawah ini.

11) Kemudian seperti panduan saya sebelumnya untuk men-drag drop recordset ke dalam tabel seperti gambar di atas.jangan lupa untuk foto dengan cara sebagai berikut.


Halaman 87

12) Setelah itu simpan halaman. 13) Pada tutorial ini sudah include kan Restrict Page di setiap halaman.


Halaman 88

Uji Coba (Bagian 2)

1) Buka halaman index.php lalu klik Administrator? yang nantinya akan dibawa ke admin_login.php 2) Tampilan login seperti gambar di bawah ini.

3) Login dengan username dan password dari admin. 4) Setelah berhasil maka akan dibawah ke halaman seperti di bawah ini.

5) Buka halaman User Management untuk mengatur pengaturan user-user yang terdaftar.


Halaman 89

6) Pada daftar di atas sudah terlihat user-user yang telah terdaftar. 7) Untuk menampilkan Biodata User maka klik Show. 8) Nanti akan terlihat seperti di bawah ini.saya mencoba menampilkan user dari Adib Rahmanudin

9) Di atas sudah muncul tampilan biodata dari Adib Rahmanudin.


Halaman 90

10) Untuk mengubah atau mengupdate username dan password dari User Adib Rahmanudin maka klik Ganti User Password.

11) Maka akan muncul tampilan seperti gambar di bawah ini.

12) Ketikkan username atau password yang baru

13) Setelah terupdate maka muncul tampilan seperti berikut ini yang menandakan bahwa username dan password telah berhasil diubah.


Halaman 91

14) Setelah itu mencoba untuk mengedit atau mengupdate data dari user lainnya mislanya Andi Kurniawan.. 15) Klik Edit maka muncul tampilan seperti gambar di bawah ini.

16) Editlah data misalnya seperti gambar di bawah ini.


Halaman 92

17) Maka setelah di edit tampilannya seperti di bawah ini.


Halaman 93

Membuat Upload File dan Galeri 1) Setelah itu saya akan membuat upload file pada User. 2) Pertama buat tabel baru pada database

3) Buat seperti gambar di bawah ini

4) Akan muncul tampilan tabel yang telah dibuat

5) Nanti akan tambahan saatu pada database Pegawai.


Halaman 94

6) Kita perlu merefresh MySQL Connectionnya

7) Buka halaman user_file.php lalu buat Recordset baru menggunakan tabel myfile.


Halaman 95

8) Field id dihilangkan. 9) Setelah itu klik OK 10) Buat Insert Record From Wizard

11) Setelah deskripsi diganti dengan Text Area Id dihilangkan Setelah di upload maka akan langsung menuju ke upload_success.php?file=uploaded


Halaman 96

12) Klik OK 13) Nanti akan muncul tampilan form input data seperti berikut ini.

14) Jika dilihat dari browser seperti berikut ini 15) Ganti textfield diganti dengan file field


Halaman 97

16) Sehingga menjadi seperti ini.

17) Field file diberi nama dengan foto.


Halaman 98

18) Masuk ke View Code. Temukan if ((isset($_POST["MM_insert"])) && ($_POST["MM_insert"] == "form1")) { (tergantung memakai form1,form2,dst) 19) Lalu tambahkan script ini $target = "upload/"; //This folder ini temat gue menampung hasil upload // $target = $target . basename( $_FILES['foto']['name']);

Ubah ($_POST [‘foto’], “text”)) menjadi ($_FILES[‘foto’][‘name’], “text”)) Lalu tambahkan script ini dibawahnya. if(move_uploaded_file($_FILES['foto']['tmp_name'], $target)) {

Cari header(sprintf("Location: %s", $insertGoTo)); lalu tambahkan script ini dibawahnya }else{ header(sprintf("Location: upload_file.php?file=error")); }

Lihat gambar di atas.


Halaman 99

20) Pada upload_file.php tambahkan sebuah Recordset baru dengan filter none dan pengurutan dari id Ascending.tampilan scriptnya seperti berikut ini.

21) Copy script recordset tadi di atas $editFormAction = $ SERVER[‘PHP_SELF’];

22) Kemudian tambahkan script di bawah ini di atas Form input data tadi ditambah dengan tag

Terimakasih, file Anda berhasil diupload

border="0" cellspacing="0" cellpadding="0">


Halaman 100

Nama :

Keterangan :

Uploaded By :

Mohon maaf, terjadi error dalam proses upload file

Ulangi upload file

23) Lihat gambar biar jelas.hehe 24) Dibawah ini menggunakan logika if else


Halaman 101

25) Dan tambahkan penutupnya di bawah Form input script di bawah ini.

Lihat gambar di bawh ini.jangan lupa tempatkan penutup

Tutorial Membuat Sistem Informasi Kepegawaian Berbasis MySQL dan Dreamweaver untuk Pemula

Recommend Documents

Terimakasih, file Anda berhasil diupload

Mohon maaf, terjadi error dalam proses upload file