CODEWITHSUNDEEP
jqueryjquery-ui
Starkers
Starkers

Reputation: 10541

Jquery UI: Presetting a slider

This is a such a head scratcher!

This slider works fine:

http://jsfiddle.net/EuTA8/

 $("#s2").slider({
        min: 0,
        max: 200,
        step: .1,
        value: 100.0,
        values: [200.0],
        slide: function(event, ui) {
           for (var i = 0; i < ui.values.length; ++i) {
              $("input.v2[data-index=" + i + "]").val(ui.values[i]+ " %");
           }
        }
});

But I want to preset the position of the slider at '100.0'. Despite having the attribute that should do this:

    value: 100.0,

...jquery UI just ignores it an puts the slider at the maximum setting.

I take the square brackets (should they even be there?!) off the values attribute to create:

    values: 200.0,

And the slider position presets beautifully. But now, I can't drag the slider! See what I mean here:

http://jsfiddle.net/EuTA8/1/

What is going on? All I need to do is preset the position. (Don't worry about the value in the input element.)

Thanks a lot.

Upvotes: 0

Views: 74

Answers (2)

ProgramFOX
ProgramFOX

Reputation: 6390

Try:

$("#s2").slider({
    min: 0,
    max: 200,
    step: .1,
    values: [100.0]
    slide: function(event, ui) {
       for (var i = 0; i < ui.values.length; ++i) {
          $("input.v2[data-index=" + i + "]").val(ui.values[i]+ " %");
       }
    }
});

You can simply remove the value: 100.0 line, and change values: [200] into values: [100]

And yes, the square brackets should be there, because values is an array.

Upvotes: 1

Jim
Jim

Reputation: 482

$("#s2").slider({
    min: 0,
    max: 200,
    step: .1,
    value: 100.0,
    values: [100.0],
    slide: function(event, ui) {
       for (var i = 0; i < ui.values.length; ++i) {
          $("input.v2[data-index=" + i + "]").val(ui.values[i]+ " %");
       }
    }
});

Change [200.0] to [100.0]

Upvotes: 1

Related Questions