Postingan lainnya
Kelas Premium!
Belajar Javascript untuk website
Gunakan kupon "mulaijs" untuk diskon 75 ribu!
jquery method post ($.post())
permisi gan, mau nanya gimana caranya biar si method post nya itu cuman ngirim 1 request aja, misal koneksi internet nya lemot na si user ngirim request nya banyak karena ga terpenuhi terus(ga ada data yang di hasil). nah caranya biar ngirim 1 request aja gimana?? jadi nanti saat koneksinya udah lancar lagi ga numpuk
7 Jawaban:
Jawaban Terpilih
setelah user ngeklik tombol submit, langsung didisable aja attribute buttonnya via javascript
$('.button').on('click',function() {
$(this).prop("disabled",true);
});
jadi ketika pertama2 button nya di click, buttonya di disabled..
terus waktu masuk ke method
$.post('url', {data}, function(data){
di sini disabled nya jadi false
})
gitu bang??
untuk solusi disabled itu memang button tidak bisa di click bang... tapi waktu saya menggunakan event keypress dan keycode == 13 untuk enter atau menjalankan fungsi click button nya, button nya masih bisa di klik
nah terus saya nemu code ini bang...
$.ajaxSetup({async: false});
kode di atas bisa mengatasi masalahnya tapi di browser agak jadi lag dan ada warning seperti ini di console
XMLHttpRequest sinkron pada utas utama sudah usang karena berdampak negatif pada pengalaman pengguna akhir. Untuk bantuan lebih lanjut kunjungi http://xhr.spec.whatwg.org/
jangan pake async false, jelas itu bikin browser enduser nge lag. javascript sangat cepat karena default behaviournya asynchronous, dengan setting async false jadinya synchronous, semua process terhambat nunggu ajax call selesai.
kalau mau toggle button berdasar ajax call pake promise chain
$('.button').on('click',function()
{
var _this = this
$(this).prop("disabled", true);
$.post('url', {data}, function(data)
{
// olah data yg diterima
})
.always(function()
{
// di sini disabled nya jadi false
$(_this).prop("disabled", false);
});
});
always() chain itu pasti jalan, mau hasil ajaxnya success atau error. jadi setelah ajax call selesai button otomatis enabled lagi.
