Reputation: 2767
I'm using the jQuery UI slider for a casino game project I am working on. I need to be able to change the "max" value based upon the players current bankroll. At first, the slider works correctly, it sets the "max" slider value to 1000, the players starting bankroll. Bust as the 'currentBankroll' variable changes, the sliders "max" value does not update. I inserted a console.log() line of code to check the value of the variable 'currentBankroll', which confirms the value is changing, but the slider "max" value stays at the initial value of 1000 and does not update. To further confuse me, I tried a solution I found here to change the "max" value.
$('#slider-range-max2').slider("option", "max", 300);
This line of code will change the sliders "max" value if I put a number in it (like 300), but will not work if I use a variable (like 'currentBankroll"). How can I change the sliders value using a variable?
$(function() {
console.log("Current Bankroll: " + currentBankroll);
$("#slider-range-max2").slider({
range: "max",
max: 0,
min: 1,
max: currentBankroll,
value: 2,
slide: function( event, ui ) {
$("#amount").val( ui.value );
sliderValue = (ui.value);
},
slide : function(event, ui) {
skillLevelSlots(ui.value);
wagerAmount = (ui.value);
$('.wager').html("$" + wagerAmount);
}
});
$('#slider-range-max2').slider("option", "max", 300);
});
Upvotes: 1
Views: 7079
Reputation: 6332
Right - you are defining your slider at a certain time and using currentBankroll to set max value. This is the value when the slider is created but this doesnt change unless you re create it. To get it to change, whenever your currentBankroll changes you could call a function that changes the value.
function currentBankrollChange(currentBankroll){
$('#slider-range-max2').slider("option", "max", currentBankroll);
}
or when a players bankroll changes you could call:
$('#slider-range-max2').slider("option", "max", currentBankroll);
Upvotes: 6