Anda di halaman 1dari 3

Membuat Rangkuman Arsip Berita atau Artikel dan Menampikan Isi Arsip dengan Ajax

February 13th, 2009Leave a commentGo to comments

Artikel kali ini saya sengaja buat dari salah satu request pembaca blog saya. Terima kasih atas sumbangsih ide dan masukan lainnya. Pada setiap aplikasi web yang mengandung fasilitas berita atau artikel tentunya tidak boleh melewatkan fasilitas ini, yaitu fasilitas arsip berita/artikel dimana adanya pemasangan fasilitas ini para pembaca dapat mengetahui berapa banyak artikel yang di buat berdasar bulan dan tahun. Contohnya pada gambar di bawah ini.

Untuk membuat arsip artikel ini intinya adalah pemahaman perintah SQL yang bertugas untuk merangkum keseluruhan artikel dan mengelompokkannya ke dalam satuan bulan dan tahun. Sebelumnya coba install table artikel ini pada MySQL anda. CREATE TABLE `artikel` ( `id` int(5) NOT NULL AUTO_INCREMENT, `judul_artikel` varchar(100) collate latin1_general_ci NOT NULL, `isi_artikel` text collate latin1_general_ci NOT NULL, `tanggal_posting` date NOT NULL, PRIMARY KEY (`id`) ); Lalu masukan beberapa record data di dalam table tersebut. Kalau gak mau capek-capek memasukan data salin saja script dari syntax ini. Setelah table terisi beberapa record coba eksekusi perintah di bawah ini. SELECT DATE_FORMAT(tanggal_posting,'%M %Y') AS SumTanggal, SUM(1) AS TotalArtikel FROM artikel GROUP BY YEAR(tanggal_posting), MONTH(tanggal_posting) ORDER BY YEAR(tanggal_posting) DESC, MONTH(tanggal_posting) DESC Penjelasan dari syntax SQL diatas adalah:

DATE_FORMAT(tanggal_posting,%M %Y) : untuk mendapatkan format tanggal berupa Bulan Tahun SUM(1) AS TotalArtikel : Akan menampung jumlah baris hasil looping artikel setiap bulan dan tahun GROUP BY YEAR(tanggal_posting), MONTH(tanggal_posting) : Mengelompokkan atau mengkompres data artikel berdasar tahun dan bulan dari tanggal posting artikel ORDER BY YEAR(tanggal_posting) DESC, MONTH(tanggal_posting) DESC : Agar hasil grouping artikel ditampilkan berdasar bulan dan tahun terbaru Dengan mengeksekusi perintah SQL diatas anda mendapatkan jumlah artikel yang dikelompokkan dalam bulan dan tahun. Jika ingin menampilkannya dan menambahkan sentuhan Ajax untuk melihat daftar artikel pada setiap bulan dan tahun maka salin saja script di bawah.

<html> <head> <title>Membuat Arsip Artikel</title> <script language="javascript" src="jquery.js"></script> <script language="javascript"> // untuk melihat daftar artikel pada bulan dan tahun yang ditentukan function loadArtikel(element,filter){ // ambil element span yang sejajar dengan element link var span = $(element).next('span'); // perlihatkan terlebih dahulu text 'loading' sebelum muncul list artikel span.html('<small>loading...</small>'); $.post('getarticle.php', {bulan_tanggal: filter}, // kirim parameter 'bulan_tanggal' ke 'getarticle.php' function(response){ span.html(response); // ubah isi span dengan hasil response dari getarticle } ); } </script> </head> <body> <? include 'connect.php'; // koneksi ke database $SQL = "SELECT DATE_FORMAT(tanggal_posting,'%M %Y') AS SumTanggal, SUM(1) AS TotalArtikel FROM artikel GROUP BY YEAR(tanggal_posting), MONTH(tanggal_posting) ORDER BY YEAR(tanggal_posting) DESC, MONTH(tanggal_posting) DESC"; $query = mysql_query($SQL); if($query && mysql_num_rows($query) > 0){ echo '<ul>'; while($row = mysql_fetch_object($query)){ echo '<li><a href="#" onClick="loadArtikel(this,''.$row>SumTanggal.'')">'.$row->SumTanggal.'</a> ('.$row->TotalArtikel.') <span></span></li>'; } echo '</ul>'; } ?> </body> </html> Untuk menambahkan sentuhan Ajax kali ini saya pakai JQuery. Buat juga file php yang akan memberi respon daftar artikel pada setiap bulan dan tahun dengan nama getarticle.php: <? // Agar memastikan bahwa halaman ini diakses dengan parameter POST: bulan_tanggal isset($_POST['bulan_tanggal']) or die('Error Parameter'); include 'connect.php'; // koneksi ke database $filter = $_POST['bulan_tanggal']; // value yang ditampung berformat: 'January 2009', 'February 2009', dsb // Tampilkan semua isi berita yang pada tanggal sesuai format 'Bulan Tahun' ( '%M %Y' ) $query = mysql_query("SELECT * FROM artikel WHERE DATE_FORMAT(tanggal_posting,'%M %Y') = '$filter'"); if($query && mysql_num_rows($query) > 0){

echo '<ul>'; // memberi respon ke javascript dengan format list while($row = mysql_fetch_object($query)){ echo '<li><a href="#artikel:'.$row->id.'">'.$row>judul_artikel.'</a></li>'; } echo '</ul>'; } ?> Untuk melihat demo program diatas silahkan kunjungi Link ini. Untuk men-download program diatas silahkan kunjungi Link ini. Semoga dapat menambah wawasan ^_^

Anda mungkin juga menyukai