Tidak bisa dipungkiri baik disadari ataupun tidak, kita sering menggunakan komponen kalender dalam banyak aplikasi web, misalnya applikasi agenda (google calendar). sebagai developer, biasanya kita menggunakan add-on dari pihak ketiga untuk komponen ini. namun terkadang, ada kalanya kita perlu membuat sendiri kompnen kalender ini, berikut saya akan menjelaskan sedikit dasar pembuatan komponen kalender ini dengan PHP.
Berikut ini bagian-bagian yang biasa ada dalam komponen kalender:
Analisis bagian-bagian pada komponen kalender (kalender diambil dari google calendar) |
Koding akan kita pisahkan menjadi dua bagian, yang pertama bagian logis, yang ekedua bagian tampilan/view, namun dalam implementasinya kita bisa menyatukan kedua bagian kode ini dalam satu file.
Buat sebuah file, untuk bagian logic masukan kode berikut:
<?php $nama_bulan = Array("Januari", "Pebruari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"); if (!isset($_REQUEST["bulan"])) $_REQUEST["bulan"] = date("n"); if (!isset($_REQUEST["tahun"])) $_REQUEST["tahun"] = date("Y"); $cbulan = $_REQUEST["bulan"]; $ctahun = $_REQUEST["tahun"]; $tahun_sebelumnya = $ctahun; $tahun_selanjutnya = $ctahun; $bulan_sebelumnya = $cbulan - 1; $bulan_selanjutnya = $cbulan + 1; if ($bulan_sebelumnya == 0) { $bulan_sebelumnya = 12; $tahun_sebelumnya = $ctahun - 1; } if ($bulan_selanjutnya == 13) { $bulan_selanjutnya = 1; $tahun_selanjutnya = $ctahun + 1; } ?>
Nah untuk bagian tampilan/view ketikan kode berikut:
<table width="300" border="1"> <tr align="center"> <td bgcolor="#999999" style="color:#FFFFFF"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="50%" align="left"><a href="<?php echo $_SERVER["PHP_SELF"] . "?bulan=" . $bulan_sebelumnya . "&tahun=" . $tahun_sebelumnya; ?>" style="color:#FFFFFF"><?php echo $nama_bulan[$bulan_sebelumnya - 1] . ' ' . $tahun_sebelumnya ?></a></td> <td width="50%" align="right"><a href="<?php echo $_SERVER["PHP_SELF"] . "?bulan=" . $bulan_selanjutnya . "&tahun=" . $tahun_selanjutnya; ?>" style="color:#FFFFFF"><?php echo $nama_bulan[$bulan_selanjutnya - 1] . ' ' . $tahun_selanjutnya ?></a> </td> </tr> </table> </td> </tr> <tr align="center"> <td align="center"><table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr align="center"> <td colspan="7" bgcolor="#999999" style="color:#FFFFFF"><strong><?php echo $nama_bulan[$cbulan - 1] . ' ' . $ctahun; ?></strong></td> </tr> <tr> <td align="center" bgcolor="#999999" style="color:#FFFFFF"><strong>Min</strong></td> <td align="center" bgcolor="#999999" style="color:#FFFFFF"><strong>Sen</strong></td> <td align="center" bgcolor="#999999" style="color:#FFFFFF"><strong>Sel</strong></td> <td align="center" bgcolor="#999999" style="color:#FFFFFF"><strong>Rab</strong></td> <td align="center" bgcolor="#999999" style="color:#FFFFFF"><strong>Kam</strong></td> <td align="center" bgcolor="#999999" style="color:#FFFFFF"><strong>Jum</strong></td> <td align="center" bgcolor="#999999" style="color:#FFFFFF"><strong>Sab</strong></td> </tr> <?php $hari_ini = date("j"); $timestamp = mktime(0, 0, 0, $cbulan, 1, $ctahun); $maxday = date("t", $timestamp); $thisbulan = getdate($timestamp); $startday = $thisbulan['wday']; for ($i = 0; $i < ($maxday + $startday); $i++) { if (($i % 7) == 0) { echo "<tr> "; } if ($i < $startday) { echo "<td></td> "; } else { $tgl = $i - $startday + 1; if($tgl == $hari_ini) { $warna_bg = "#FF0000"; //warna merah } else { $warna_bg = "#FFFFFF"; //warna putih } echo "<td align='center' valign='middle' height='20px' bgcolor='".$warna_bg."' >" . $tgl . "</td>"; } if (($i % 7) == 6) { echo "</tr>"; } } ?> </table> </td> </tr> </table>
sekarang coba load di browser:
Untuk tampilan silahkan sesuaikan dengan keinginan masing-masing (bisa dipadukan dengan css). semoga tutorial singkat ini bisa bermanfaat.
0 komentar:
Posting Komentar