Jumat, 16 Desember 2011

JQuery: Alternatif Partial-Content Ajax Loading

Alhamdulillah, setelah mencoba berjam-jam, akhirnya saya bisa mendapatkan cara alternatif untuk memuat konten parsial sebuah laman web dengan mekanisme AJAX. Cara mudah yang biasa digunakan adalah dengan memanfaatkan fungsi JQuery load(). Namun, karena beberapa alasan, mengharuskan saya mencari cara alternatif untuk melakukan hal tersebut.


Seperti yang sudah lumrah diketahui, kode untuk memuat sebuah konten parsial dari konten utuh mungkin seperti ini.

 $('#main').load('http://foo.com/bar.html #page-content');

#main tersebut merupakan selector untuk penampung kontennya. Sedangkan #page-content adalah selector untuk bagian (part) dari konten utuh file bar.html yang akan dimuat.

Nah, karena saya merasa fungsi tersebut terlalu kaku dipakai, maka saya mencoba memanfaatkan fungsi lain yang juga menggunakan mekanisme pemuatan yang sama.

 $.ajax({
   url: 'http://foo.com/bar.html',
   success: function(response) {
     $('#main').html($(response).find('#page-content'));
   }
 });

Yups, menggunakan fungsi $.ajax() sebagai alternatifnya. Mungkin tidak perlu saya jelaskan secara detail karena di situ juga sudah terpampang cukup jelas :P

Yang perlu diketahui adalah cara mendapatkan konten parsialnya, yaitu memanfaatkan fungsi find() dengan format seperti yang telah tertulis di kode...

Hehe, anyway busway, cukup sekian dan terima kasih (atas kunjungannya).
Mugi manfaat ^_^