Jason Milam
Jason Milam

Reputation: 111

Disable jQuery UI slider

I have a slider that I am trying to disable based on a jQuery if/else statement.

if (("#ceremony").checked) {
  $( "#ceremony_amount" ).val( "$" + $( "#ceremony-range-min" ).slider( "value"         ).toFixed(2) );
}
else {
  $( "#ceremony_amount" ).val( "$" + $( "#ceremony-range-min" ).slider( "disable" ).toFixed(2) );
}

This will disable the slider with no issues but when I go to checked the checkbox with the id = "ceremony" it does not enable the slider again.

I am trying to figure out if i'm not calling my checked attribute properly or if its something in my if/else statement. Any help would be appreciated.

Upvotes: 1

Views: 4390

Answers (2)

Adil Shaikh
Adil Shaikh

Reputation: 44740

You need to use change event on checkbox

$('#ceremony').on('change', function () {
    if (this.checked) {
        $("#ceremony_amount").val("$" + $("#ceremony-range-min").slider("value").toFixed(2));
    } else {
        $("#ceremony_amount").val("$" + $("#ceremony-range-min").slider("disable").toFixed(2));
    }
});

Upvotes: 0

SpYk3HH
SpYk3HH

Reputation: 22580

Change

$( "#ceremony_amount" ).val( "$" + $( "#ceremony-range-min" ).slider( "value").toFixed(2) );

To

$( "#ceremony_amount" ).val( "$" + $( "#ceremony-range-min").slider("enable").slider("option", "value" ).toFixed(2) );

Upvotes: 1

Related Questions