Mengimplementasikan AJAX pada Blogger
Mungkin beberapa dari kalian ada yang pernah memperhatikan/membaca komentar-komentar lama Saya atau perkataan lama Saya yang pernah Saya ucapkan, yang menyatakan bahwa kita tidak bisa mengimplementasikan AJAX pada blogspot. Saya ingin menyangkal semua perkataan Saya itu dan ingin mengatakan bahwa AJAX memungkinkan untuk diimplementasikan pada blogspot!
Untuk membuktikannya, coba Anda klik tombol di bawah ini:
Tombol di atas cuma contoh awal, jadi hasil yang termuat jelas akan tampak sangat berantakan. Untuk membaca artikel ini lagi, mohon muat ulang halaman ini setelah Anda melihat efek yang terjadi.
Seperti yang kita semua tahu bahwa AJAX hanya berlaku untuk domain lokal, itu memang benar. Selama ini sepertinya Saya terlalu paranoid atau bahkan skeptis mengenai kekuatan blogspot yang sangat terbatas sehingga Saya tidak menyadari bahwa apapun bentuknya, asalkan URL yang digunakan untuk memuat adalah URL lokal, maka bisa dipastikan kita bisa mengimplementasikan AJAX pada platform tersebut. Karena bisa atau tidaknya kita di dalam mengimplementasikan AJAX sama sekali tidak ditentukan oleh kemampuan CMS Blogger bukan merupakan CMS, melainkan blog service.
Berikut ini adalah kode yang Saya gunakan:
HTML
<div id="loading-text"></div>
<div id="container"></div>
<a id="ajax-button-example" href="/search/label/jQuery?max-results=10">Klik Untuk Memuat Halaman dengan AJAX</a>
jQuery
$('#ajax-button-example').on("click", function() {
var url = this.href;
$('#loading-text').html('<span>Memuat halaman...</span>');
$('#container').load(url, function() {
$('#loading-text').html('');
});
return false;
});
Hanya penerapan jQuery .load()
yang sangat mendasar. Jika sebelumnya Anda sudah pernah belajar mengenai seluk-beluk jQuery AJAX pasti Anda akan dengan mudah mengerti mengenai ini.
Ke depannya, mungkin akan ada beberapa tutorial/info mengenai pengimplementasian AJAX pada platform blogspot. Tapi Saya masih butuh waktu untuk memantapkannya. Begitulah.
18 Komentar
kamu info
mantap mas :-bd
IRIL SAGITA
kak, kalau mau buat .load() menjadi link http://www.dte.web.id/p/cari-artikel.html?q=.load() pada postingan gimana kak ?
tujuannya utuk menautkan search entry pada postingan seperti yang ada disini.
Taufik Nurrohman
Kalau untuk fasilitas menampilkan hasil penelusuran secara langsung, menggunakan feed posting sebenarnya juga sudah cukup. Pakai
$.ajax()
atau$.getJSON()
IRIL SAGITA
Caranya ?
Unknown
Wah semakin menarik pembahasannya..
di tunggu versi detailnya..
Sukses Selalu untuk Mas Taufik :-bd
bond
inovasi baru buat blogger.. THANKSSS....
Anonim
maaf kang keluar dari bahasan, cuma mau kasih tau
nontifikasinya kayaknya error tuh, pas diklik nga bisa menampilkan koment terakhir :P
Taufik Nurrohman
Sudah FIX. Terima kasih banyak <:) Kuman-kuman sudah ditemukan dan berhasil diberantas!
Suwardi
Sekarang jadi penyimak yang baik saja deh dulu dan kalau ada waktu akan coba di blog Lab alias blog yang mengunakan akun lama...
Anonim
mas kalo mau buat infinite scroll di blog gmn .jadi waktu di hompage di scroll kebawh muncul postingan lagi kaya wordpress 7:(
Taufik Nurrohman
Pakai JSON saja: /2012/11/memperbaharui-pemuatan-json-berdasarkan.html
Feed posting nanti diset menjadi default, bukan summary. Tidak mungkin bisa dijelaskan di area komentar.
Anonim
postingin aja mas haha
budkalon
iya, :) posting aja
Taufik Nurrohman
⇒ /2013/03/infinite-scroll-experiment-with-blogger.html
Yusril Ibnu Maulana
Keren \o/ , tapi sayang masih "ada blog di dalam blog", ditunggu perkembangannya :D
kawsar
i dont reely understand what this does?
where exactly does the html code go?
im guessing this loads the label pages via ajax but on your demo page everything refreshes i dont see ajax load
Taufik Nurrohman
Works fine for me :\
Just click the button, don't open it in new tab. Or, try click this link to load a comment item based on comment permalink:
⇒ /2013/04/widget-blogger-untuk-menampilkan-daftar.html?showComment=1368415953261#c7237788095186558105
budkalon
Kok ada logo DTE pegang golok? Serem banget 7:(