CODEWITHSUNDEEP
javascriptjquerydragdealer-js
kalpetros
kalpetros

Reputation: 983

Get slider's value jQuery

I created a slider using Dragdealer and I'm having a problem reading the slider's value.

Here is my HTML:

<div id="just-a-slider" class="dragdealer">
    <div class="handle red-bar">
        <span class="value"></span>%
    </div>
</div>

and Javascript to enable the slider:

new Dragdealer('just-a-slider', {
  animationCallback: function(x, y) {
    $('#just-a-slider .value').text(Math.round(x * 100));
  }
});

How to read the value the user has selected?

For example I want to do something like that:

var sliderValue = document.getElementById("just-a-slider").value;

// When the user clicks the Apply button an empty div gets the slider's value that the user selected
var greetingString = sliderValue;
document.getElementById("users_choice").innerText = greetingString;

Upvotes: 0

Views: 1980

Answers (3)

IT ppl
IT ppl

Reputation: 2647

Here is the Fiddle

HTML

<div id="just-a-slider" class="dragdealer">
    <div class="handle red-bar">
        <span class="value"></span>%
    </div>
</div>
<input type="button" value="Get slider value" id="button1" />

jQuery

new Dragdealer('just-a-slider', {
  animationCallback: function(x, y) {
    $('#just-a-slider .value').text(Math.round(x * 100));
  }
});

$('#button1').click(function(){
    alert($('#just-a-slider .value').text());
});

Live demo here

Upvotes: 1

Steven
Steven

Reputation: 188

From the documentation at http://skidding.github.io/dragdealer/ it seems you can simply do

var sliderValue = $('#just-a-slider').getValue();

getValue - Get the value of a Dragdealer instance programatically. The value is returned as an [x, y] tuple and is the equivalent of the projected value returned by the regular callback, not animationCallback.

Upvotes: 0

Arsen Ibragimov
Arsen Ibragimov

Reputation: 435

Try this

$('#users_choice').text() = $('#just-a-slider .value').text();

Upvotes: 1

Related Questions