Another question still regarding sliders

Question

(I chose to start a new topic here since I don't know if the ones in the old forum are still being answered or if the respondents are being reported of new comments)

Based on this famous thread ( https://www.sawtoothsoftware.com/forum.php?cmd=show&thread=1608&posts=3 ), I'm using a slider on my survey. What I want to do is to store the last value the user chooses in the slider, before clicking the "next" button, or simply put, his final answer to that question. Though, I can't output the slider's value every time the user clicks in it, for debugging purposes.

<input name="PerguntaVAS1_v1" id="PerguntaVAS1_v1" type="hidden" onchange="s.setValue(parseInt(this.value))">

<!-- HTML to use for the slider //-->
<p><div class="slider" id="slider-1" tabIndex="1">
   <input class="slider-input" id="slider-input-1"/>
</div>

<!-- JavaScript object that handles the logic //-->
<script type="text/javascript">

var s = new Slider(document.getElementById("slider-1"), document.getElementById("slider-input-1"));

s.setValue(0);

s.onchange = function ()
{
    document.getElementById("PerguntaVAS1_v1").value = s.getValue();
    document.getElementById("h-min").value = s.getMinimum();
    document.getElementById("h-max").value = s.getMaximum();
    //document.write(SSI_GetValue("PerguntaVAS1_v1"));
    alert("My value at this point is: " + SSI_GetValue("PerguntaVAS1_v1"));
};
s.setValue(0);

window.onresize = function () {
    s.recalculate();
};

alert("My value at this point is: " + SSI_GetValue("PerguntaVAS1_v1"));

</script>

I do know the value is stored in "PerguntaVAS1_var1", but I could only get to output it in the beginning, and I thought that outputting it inside the "onchange" function would get me to do what I want, still nothing appears, I must be doing something weird. Anyone has a suggestion?

Thanks,
João

Comments

With help, I managed to put a slider doing what I want right here:

http://jsfiddle.net/wowenkho/uGcTx/

The problem is that I can't seem to emulate it inside SSI Web, and I don't know why :\ If someone knows something more about this, please answer. I'd be really glad to read a second opinion on this...

Meanwhile, I'm working on making a jQuery version to function properly in SSI Web 7.026, since it is now the default library used in 8.0 onwards.

Cheers,
João

Answer 1

I do got to put a slider showing its current value, in HTML5 it is very, very easy. The only problems are the fact that I cannot define its width (it's very small), and I don't know what kind of browser compatibility issues may appear, since this is a kind of new feature. If anyone knows how to improve any of the two approaches, I would appreciate a lot to know it.

Code:

<input type="range" min="0" max="100" value="30" step="5" onchange="showValue(this.value)"/>

<span id="range">0</span>

<script type="text/javascript">

function showValue(newValue)
{
    document.getElementById("range").innerHTML=newValue;
}

</script>