if you want to submit the value everytime it change you can try my code, but you have a bad idea if you do that.. its better you have a button to tell your server that the client is done picking the price.
i just update you code i hope it help.
<script>
$(function() {
var sliderChangeCallback = function(){
var amount1 = $( "#amount1" ).val(), amount2 = $( "#amount2" ).val()
$.ajax({
url : "your url",
data : {
"amount1" : amount1,
"amount2" : amount1
},
error : function(){
"call back error"
}
})
};
$( "#slider-range1" ).slider({
range: true,
min: 0,
max: 500,
values: [ 75, 300 ],
slide: function( event, ui ) {
$( "#amount1" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
sliderChangeCallback();
}
});
$( "#amount1" ).val( "$" + $( "#slider-range1" ).slider( "values", 0 ) +
" - $" + $( "#slider-range1" ).slider( "values", 1 ) );
$( "#slider-range2" ).slider({
range: true,
min: 0,
max: 500,
values: [ 75, 300 ],
slide: function( event, ui ) {
$( "#amount2" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
sliderChangeCallback();
}
});
$( "#amount2" ).val( "$" + $( "#slider-range2" ).slider( "values", 0 ) +
" - $" + $( "#slider-range2" ).slider( "values", 1 ) );
});
</script>