jQuery UI Slider multiple events triggers
The jQuery UI slider allows events to be triggered on start, slide, change, stop (see: http://jqueryui.com/demos/slider/#events)
I need values to be shown in an input field during SLIDE, and need a form to submit on STOP. However it seems that if the function has two even triggers, it fails to render the slider.
Here's the working code:
<script>
$(function() {
$( "#slider-range" ).slider({
range: true,
min: 50,
step: 10,
max: 500,
values: [ 75, 450 ],
slide: function( event, ui ) {
$( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] + " avg/night" );
$( "#edit-nightlyavg-min" ).val( ui.values[ 0 ] );
$( "#edit-nightlyavg-max" ).val( ui.values[ 1 ] );
}
});
$( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
" - $" + $( "#slider-range" ).slider( "values", 1 ) + " avg/night" );
$( "#edit-nightlyavg-op" ).val( "between" );
});
</script>
Here's the non-working code:
<script>
$(function() {
$( "#slider-range" ).slider({
range: true,
min: 50,
step: 10,
max: 500,
values: [ 75, 450 ],
slide: function( event, ui ) {
$( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] + " avg/night" );
$( "#edit-nightlyavg-min" ).val( ui.values[ 0 ] );
$( "#edit-nightlyavg-max" ).val( ui.values[ 1 ] );
}
stop: function( event, ui ) {
$( "#views-exposed-form-location-directory-page-1" ).submit();
}
});
$( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
" - $" + $( "#slider-range" ).slider( "values", 1 ) + " avg/night" );
$( "#edit-nightly开发者_开发百科avg-op" ).val( "between" );
});
</script>
You forgot the ,
after the 'slide' function.
精彩评论