I have a page where I need to trigger a function call when a user
changes the value of either end of the slider. I create the slider
when the DOM is ready using this:
$('#productmatrix-slider').slider({ min: sliderMin, max:sliderMax,
range: true, change: function(e,ui) { submitProductMatrix() } });
The function 'submitProductMatrix() is defined elsewhere in my .js
file.
So, this works whenever I grab one of the slider handles and move it.
However, I also have a button the user can click that will 'reset' the
slider back to the original sliderMin and sliderMax values. This is
the code that does that:
function setCurrentSliderPositions(currentPositionLow,
currentPositionHight){
$('#productmatrix-slider').slider("moveTo", currentPositionLow,
0 );
$('#productmatrix-slider').slider("moveTo", currentPositionHight,
1 );
}
The problem is that for each "moveTo", it triggers that callback
function, and so I end up executing the 'submitProductMatrix' function
twice when I reset the the slider.
So, my thought was that I could unbind the 'change' event on the
slider before I do the 'moveTo' and then rebind the 'change' event
after I am done. But, I can't get that to work. Does anyone have any
ideas on what I am doing wrong?
Thanks in advance, Chris
