Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
cara memasukkan API ke Jquery
1. Menggunakan jQuery Ajax, buatlah sebuah request ke API Google books https://www.googleapis.com/books/v1/volumes?maxResults=10&q=kata_kunci untuk menampilkan buku-buku (judul, penulis, deskripsi) yang memiliki kata kunci yang bisa dimasukkan pengguna melalui sebuah elemen input
2. Menggunakan jQuery Ajax, tampilkan semua tweet (text, screen_name, created_at, profile_image) untuk keyword "#fasilkomunsri" secara real time dengan cara mengambil tweet baru pada tautan http://api.babyhanana.com/index.php/twitter/search yang diakses setiap 10 detik dengan method "GET" dan parameter "since_id" yang merupakan batas id terkecil yang akan ditampilkan.
4 Jawaban:
Ini maksudnya agan bingung cara implementasi api di ajax?
ini soal nya, yang point ke 5 dan 6 saya tidak mengerti cara buat nya.
1. Buatlah sebuah paragraf yang berisi pemahaman Anda tentang jQuery
2. Buatlah sebuah/beberapa paragraf yang menjelaskan maksud perintah jQuery berikut: $(this).hide() $("h1").click(function(){ alert('Dor') }); $(".barisgenap").hide() $("#elemenkedua").focus(function(){ $(this).css("background-color", "#cccccc"); });
3. Memiliki sebuah tombol yang apabila ditekan akan menghilangkan sebuah elemen. Setelah elemen tadi hilang, maka akan muncul sebuah elemen yang lain. Setelah elemen kedua ini muncul, maka akan muncul pesan pemberitahuan yang bertuliskan "Taraaaa"
4. (Poin 3) Buatlah sebuah tulisan dan sebuah tombol. Sebelum tombol ditekan, maka tulisan ini normal. Tapi setelah tombol ditekan sekali, maka tulisan ini akan menjadi misterius, yakni dia menghilang begitu cursor mouse melewatinya dan muncul kembali ketika cursor mouse tidak lagi melewatinya.
5. Menggunakan jQuery Ajax, buatlah sebuah request ke API Google books https://www.googleapis.com/books/v1/volumes?maxResults=10&q=kata_kunci untuk menampilkan buku-buku (judul, penulis, deskripsi) yang memiliki kata kunci yang bisa dimasukkan pengguna melalui sebuah elemen input
6. (poin 3) Menggunakan jQuery Ajax, tampilkan semua tweet (text, screen_name, created_at, profile_image) untuk keyword "#fasilkomunsri" secara real time dengan cara mengambil tweet baru pada tautan http://api.babyhanana.com/index.php/twitter/search yang diakses setiap 10 detik dengan method "GET" dan parameter "since_id" yang merupakan batas id terkecil yang akan ditampilkan.
Wah, ini tugas kuliah atau apa ya? Berbentuk soal begini..
Jawaban Terpilih
Saya akan jelasin yang nomor 5 dulu. - Di soal ini langkah pertama agan musti liat dlu data json yang pingin diolah/ditampilin dari link yang ada disoal 5 (link ini : https://www.googleapis.com/books/v1/volumes?maxResults=10&q=kata_kunci), intinya link itu berupa data yang nanti akan dicari.
- Nah udah jelas sih disitu, si soal minta kita buat element input (semacam kayak input search gitu), hasil yang kita ketikin di kolom search itu bakal nampilin data (berupa judul, penulis, deskripsi ---> element yang ada di data json juga) json dari link yang tadi.
- Proses carinya gimana? Pakai ajax jquery.
Kalo sy jabarin berupa codingan jquery sih gini :
//ketika cari data, silahkan kalo mau pakai on change atau click.
$(document).on('click','#id_button_input_search', function(){
var input = $("input[name='name_input_search']");
//ajax
$.get("https://www.googleapis.com/books/v1/volumes", {
maxResults:10,
q:input.val()
}, function(resp_data){
var item = resp_data['items'];
//data hasil search muncul (cek console)
console.log(item);
});
});
Untuk menampilkan data berdasarkan judul, penulis, deskripsi di perhatikan aja data jsonnya. Ohya, data variable item itu berupa array jadi nampilinnya pake looping lagi.