9.1 $ objek dan metode ajax di jQuery
jQuery juga memiliki objek global khusus untuk bekerja dengan jaringan. Seperti yang bisa Anda tebak, ini disebut $
. Ya, itulah namanya. Tapi itu sederhana dan nyaman.
Katakanlah Anda ingin mengirim permintaan ke API di JavaScript Anda dan memproses tanggapan yang diterima. Ini bisa dilakukan seperti ini:
$.ajax({
type: "POST",
url: "api.codegym.cc",
data: {name: 'Bill', location: 'Radmond'},
success: function(msg){
alert( "Person found: " + msg );
}
});
Itu saja, itu saja kodenya. $
Kami memanggil metode pada objek ajax()
, di mana kami meneruskan objek yang menjelaskan semua yang kami butuhkan: permintaan dan respons.
- Bidang
type
menentukan jenis permintaan HTTP:GET
atauPOST
- Bidang
url
menentukanurl
ke mana permintaan akan dikirim. - Bidang
data
menentukan data permintaan dalam format JSON - Bidang sukses menentukan fungsi yang akan dipanggil setelah respons sukses dari server.
9.2 Permintaan yang berguna
Tetapi jika Anda tidak perlu mentransfer data apa pun, permintaan dapat ditulis lebih singkat. Misalnya, Anda dapat menulis permintaan POST sederhana seperti ini :
$.post("ajax/test.html", function( data ) {
$( ".result" ).html( data );
});
Apakah Anda tahu apa yang dilakukan kode $( ".result" ).html( data );
? Ayo coba tebak...
Ia menemukan elemen dengan kelas hasil dalam dokumen, dan menambahkan kode HTML di dalamnya - data data
. Jadi dalam beberapa baris Anda dapat mengunduh data dari server dan menambahkannya ke halaman Anda. Nah, bukankah itu suatu keindahan? :)
Permintaan GET juga dapat ditulis dalam beberapa baris:
$.get("ajax/test.html"., function( data ) {
$( ".result" ).html( data );
});
Apakah Anda ingin mengunduh dan menjalankan skrip?
$.ajax({
method: "GET",
url: "test.js",
dataType: "script"
});
Dapatkan halaman HTML terbaru?
$.ajax({
url: "test.html",
cache: false
})
.done(function( html ) {
$( "#results" ).append( html );
});
Ada beberapa dokumentasi jQuery yang sangat bagus di internet:
Selain itu, semua pertanyaan umum mudah dicari di Google dan ada di StackOverflow.
GO TO FULL VERSION