Ketemu lagi neh,, mudah2an gak bosen.. oke sekarang kita akan menyambung kembali materi yang udah kita bahas di bagian sebelumnya, klo kemarin hanya sekedar memperkenalkan file-file yang akan kita buat termasuk bagaimana caranya tuk membuat database dan mengkoneksikannya.. maka sekarang kita akan membuat file utama dari program ini, yaitu index.php yang akan menjadi tampilan awal program..
Sebelum itu, saya pengen memperbaiki kekurangan yang ada di bagian 1, (maaf banget, karena saya baru diingetin ama temen). sebenarnya kita masih membutuhkan 1 tabel lagi dalam membuat program ini, yaitu Tabel Master yang isinya merupakan data-data pokok dari program ini… (kurang lebih itulah pengertian saya mengenai tabel master, maaf klo kurang jelas karena saya sendiri cukup lemah di teori, hehehe ngaku juga…., tapi yang jelas, program itu intinya PRAKTEK, bukan ngebanyakin TEORI, yah ngeles juga ni anak..)
Oke sekarang serius, sebelum membuat tabel tersebut, perlu dijelasin dulu, program kita adalah program penggajian yang akan menghitung gaji pokok, tunjangan istri(bila sudah menikah) dan tunjangan anak(bila sudah punya anak) berdasarkan golongan pegawai tersebut. (tentunya bagi mahasiswa MI penghitungan seperti ini udah gak asing lagi). Maka, kita akan membuat tabel yang berisi data-data tersebut, yang akan kita namakan tabel gol. (klo belum tahu caranya lihat kembali di bagian 1).
Strukturnya seperti ini :
Dan karena ini berbentuk tabel master yang datanya sudah harus ada lebih dulu, maka tabel ini akan kita isi secara manual, caranya pilih tabel gol dari phpmyadmin, lalu klik menu insert dan isilah tabel tersebut dengan data-data di bawah ini :
(sementara 3 golongan dulu, selebihnya bisa teman2 modif lagi)
Disini kita akan memakai macromedia dreamweaver 7,,, caranya :
1. Buka dreamweaver, lalu pilih di bagian create new, ada tulisan php
2. Setelah bertemu dengan halaman yang kosong, maka secara default bagian design telah terpilih ketika pertama kali sebuah file akan dibuat.
Catatan : di halaman tersebut ada 3 bagian yang harus kita ketahui :
a. Code : untuk menampilkan dan membuat program dengan memasukkan kode/syntax secara manual
b. Split : untuk menampilkan dan membuat program dengan tampilan ganda, yaitu tampilan kode dan design
c. Design : yaitu tampilan yang khusus memperlihatkan hasil dari kode yang dibuat, tapi disini kita bisa lebih mudah memasukkan komponen yang dibutuhkan tanpa membuat kode dulu, yaitu dengan memilih komponen yang tersedia, maka otomatis kode dari komponen tersebut telah tercipta di bagian Code.
3. Setelah itu, pilih menu insert -> table -> isi Rows/baris dan Columns/kolom sesuai keinginan, dalam latihan ini kita akan membuat 10 kolom dan 2 baris, kenapa Cuma 2 baris? Nanti kita bahas..
4. Pilih di bagian header, letak judul kolom yang kita inginkan,
5. Isi caption dengan judul tabel yang akan kita buat, yaitu tabel penerimaan gaji, lalu klik Ok
6. Isilah nama kolom sesuai dengan program yang kita buat, seperti pada contoh :
Pasti bagi temen2 yang sedang focus, akan mempertanyakan kenapa hanya 1 baris yang dikosongkan?? Klo jumlah datanya banyak gmn? Nah disitulah uniknya pemrograman, kita tidak perlu membuat baris satu-satu sebanyak data yang diminta, karena kita akan membuat data yang dinamis, dimana baris data akan berjumlah sesuai dengan jumlah data yang ada pada database, caranya dengan cara membuat perulangan menggunakan sintax PHP. 1 baris yang kosong itulah yang akan kita ulang sebanyak jumlah data dalam database.
7. Pastikan halaman kerja anda berada di bagian design dreamweaver,, lalu arahkan kursos di baris kedua kolom aksi di bagian pertama, lalu ketik Edit, dan isikan pula di kolom berikutnya : Delete
Perlu dipahami terlebih dahulu, file ini tentunya akan membutuhkan koneksi ke database, karena data yang ditampilkan adalah data dari database, bukan data yang kita masukkan secara manual. Maka, kita butuh file koneksi.php, karena kita sudah membuatnya di 1 file (pembahasan di bag.1), So kita hanya perlu mengetikkan kode :
<?php require(“koneksi.php”); ?>
Artinya : masukkan kode2 yang ada di koneksi.php ke dalam file yang sedang kita buat ini, lebih simple kan?
8. Langkah tadi baru mengkoneksikan program dengan database, tapi belum dengan tabelnya, maka ketikkan di antara <?php —– ?> (jangan di luar ?> ) sintax ini :
$sql = mysql_query(“select * from karyawan“);
artinya : pilihlah data dari tabel karyawan, dan masukkan nilainya ke dalam variabel $sql.
INGAT! Di bab 2 ini kita sudah mulai mempelajari alur logika program, maka yang diperhatikan bukan hanya cara membuatnya secara tekstual, tapi juga yang lebih penting lagi kita harus bisa memahami alur logikanya. Seperti yang sudah diberitahu sebelumnya, kita akan membuat perulangan dari satu-satunya baris yang kosong (liat kembali gambar tampilan tabel penerimaan gaji)
Caranya : masuklah ke halaman code, lalu ingatlah baik2, kita akan mengulangi baris 2 yang kosong sebanyak jumlah n pada database, maka kita harus memasukkan kode perulangan sebelum kode baris kedua tersebut, yaitu di atas kode <tr></tr> yang kedua atau di bawah kode <tr></tr> yang pertama. NOTE : kode <tr></tr> yang pertama menghasilkan baris yang pertama, dan <tr></tr> yang kedua menghasilkan baris kedua, karena itulah kita akan menyimpan perulangan sebelum kode baris kedua. (ingat2 lagi kode HTML nya ya… hehe). Lebih jelasnya seperti ini :
Penjelasan kode php :
è $no=1 -> memasukkan nilai 1 ke dalam variable no. (digunakan untuk nilai dari judul kolom No dari tabel
è while($tampil = mysql_fetch_array($sql) )
while() -> perintah mengulang
$tampil = mysql_fetch_array($sql) -> variabel $tampil akan diberi nilai dari mysql_fetch_array($sql), yaitu fungsi untuk menampilkan data dari variabel $sql, variabel $sql adalah variabel yang sudah kita jelaskan di no. 8.( Coba liat lagi ya…)
So, variabel $tampil saat ini adalah berisi tampilan data dalam database yang berasal dari judul kolom
è secara keseluruhan, kode while($tampil = mysql_fetch_array($sql)), mempunyai arti : ulangi sebanyak data yang ada dalam tabel karyawan (berdasarkan variabel $sql)
è jangan lupa ketikkan tanda {setelah kode tersebut sebagai tanda perulangan akan dimulai dari arah mana, maka kode yang ada di bawah tanda { itulah yang akan kita ulangi, yaitu kode <tr></td> yang kedua. Tanda } akan ditutup di akhir data yang akan diulang.
Lalu bagaimana dengan alur tampilan dari hasil perulangan tersebut lebih jelas? Nanti akan kita bahas, yang pasti sekarang kita akan memasukkan isi dari baris yang akan kita ulang itu dengan php. Perhatikan gambar :
Bagi yang belum tahu, program akan selalu mengeksekusi kode dari baris pertama hingga baris akhir secara berturut-turut, sehingga jika kita melihat kode perulangan pada gambar di atas, maka eksekusi program akan seperti ini :
Perulangan pertama :
Perulangan kedua, akan menampilkan data-data dari baris kedua di database, dan begitulah seterusnya sampai semua data dalam database ditampilkan, ketika data telah habis, maka berakhir pula perulangan yang diperlihatkan di atas.
Perhatikan tulisan yang diberi garis merah, nama-nama tersebut di ambil dari nama field/kolom yang ada pada database, dengan catatan tulisan tunis, = tunjangan istri, tunak = tunjangan anak dan gatot = gaji total. (mudah-mudahan sampe sini temen-temen sudah paham, jadi kita bisa ngelanjutin ke proses selanjutnya).
Setelah langkah tadi dilakukan, kita akan kembali memasukkan kode php, jangan sampe lupa kawan, dalam perulangan di awal kita memasukkan variabel $no untuk memunculkan no 1 hingga data dalam tabel karyawan habis, maka tentunya kita harus menambah fungsi variabel tersebut agar selalu nilainya bertambah 1 setiap kali perulangan, maka di akhir perulangan, yaitu sebelum perulangan di tutup dengan tanda kurung }, kita masukkan kode $no++, yang artinya nilai variabel $no akan selalu bertambah 1 dalam setiap kali perulangan, baru setelah itu tambahkan tanda kurung } untuk menutup perulangan tersebut, kode lebih lengkapnya seperti ini :
<?php $no++; } ?> ——–à masukkan kode tersebut setelah kode </tr>
Nah, ini yang terakhir sebelum kita beralih ke postingan selanjutnya, masuk ke halaman design di program dreamweaver, lalu tambahkan link [tambah] di bawah tabel dengan hanya tinggal ketik [tambah] di TKP, lalu sorot tulisan tersebut, kemudian tuliskan gaji.php di kolom link di bagian properties yang terletak di bawah, maka otomatis tulisan [tambah] tersebut akan menjadi link yang ketika di klik akan mengarah ke file gaji.php, namun sampai sekarang kita belum membuatnya. Insya Allah di postingan bagian 3 akan kita bahas. Dan satu lagi, tulisan Edit dan Delete yang ada pada tabel pun akan kita jadikan link, namun itu akan kita bahas pada postingan mengenai edit.php
fiuuuuh.. akhirnya beres juga untuk postingan kedua ini… buat temen2 yang ingin kasih saran jangan segan-segan untuk meninggalkan komentar ya.. yang gak punya saran pun tetap wajib kasih comment, (loh ko maksa??!), maksudnya biar si penulis tahu, klo blog ini ada manfaatnya? Atau malah sebaliknya?? Klo gak gitu, penulis akan kesulitan untuk membenahi kekurangan yang ada. Dan terakhir, mohon dukungan dari temen-temen semua.
Note : agar gambar lebih jelas, silahkan di klik gambar tersebut untuk memperbesar
SAMPAI KETEMU LAGI DI POSTINGAN SELANJUTNYA.
Taufiq Akbar W.
