How to create an ajax call on jQuery slide change?
How do I call this Jquery ajax call on jQuery slide change?
function callpage() {
$('#formcontent').empty().html('<p style="margin-top:20px;text-align:center;font-family:verdana;font-size:14px;">Vent venligst, henter webhosts.</p><p style="margin-top:20px;margin-bottom:20px;text-align:center;"><img src="../images/ajax.gif" /></p>');
var form = $(this).closest('form');
$.ajax({
type: form.attr('method'),
url: form.attr('action'),
data: form.serialize(),
success:function(msg){
$('#formcontent').html(msg);
}
}
My jQuery slider code:
$("#开发者_如何学运维slider").slider({
value:'',
min: 0,
max: 5000,
step: 250,
slide: function(event, ui) {
if (ui.value == $(this).slider('option', 'max')) {
$(ui.handle).html('Ubegrænset');
$('#sliderValueplads').val('99999');
} else {
$(ui.handle).html(ui.value + ' MB');
$('#sliderValueplads').val(ui.value);
}
}
}).find('a').html($('#slider').slider('value'));
$('#sliderValueplads').val($('#slider').slider('value'));
My new slider code:
$("#slider").slider({
value:'',
min: 0,
max: 5000,
step: 250,
stop: function(_, ui){
callpage();
},
slide: function(event, ui) {
if (ui.value == $(this).slider('option', 'max')) {
$(ui.handle).html('Ubegrænset');
$('#sliderValueplads').val('99999');
} else {
$(ui.handle).html(ui.value + ' MB');
$('#sliderValueplads').val(ui.value);
}
}
}).find('a').html($('#slider').slider('value'));
The problem is that the ajax call is not made, but the HTML is replaced. Which is a little strange because I just have tested the callpage with this $('#left input:checkbox').change(callpage);
and the callpage did work as expected
If you mean when the user stops moving the slider then bind it to the stop event in your constructor.
stop: function(_, ui){
callpage();
}
精彩评论