Jquery Ui Slider, Multiple Value Output

I am trying to configure a slider to display multiple values with one being a standard number output and the other being an output from a value in an array. http://jsfiddle.net/YK

Solution 1:

Do you mean something like this?

http://jsfiddle.net/EvPTj/5/

var ageInput = $("#ageInput"),
    initialValue = 1,
    values = [];

values = ['',15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39,15,23,26,32,39];

var updateSliderValue = function (e, ui) {
    var slider = $(this).data().slider;
    var index = ui.value || 0;
    if (index) {
        $("#amount").html(index + "=" + values[index]);
        slider.element.find(".ui-slider-handle").text(slider.value());
    }
};

var value = $("#slider").slider("value");
$("#amount").html(value);


ageInput.slider({
    min: 0,
    max: 100,
    slide: updateSliderValue,
    create: updateSliderValue,
    value: initialValue
});

af