I am trying to create a form with a range type input. Like
<input id="slider1" type="range" min="0" max="100" step="10" />
Here the values are integer only like :
0,1,2,3,4,5........99,100.
Is it possible to create the range values something like string or other type from database like:
String1, String2, String3
Thanks.
So far, its not possible to pass diffrent value dynamically, but if someone wants to show options via the range type, then he needs to do this as @phari mentioned above.
Suppose we have a range type input and we want to select some values by this. The code for the input type is:
<input type="range" min='0' max ='3' step='1' >
Here anyone can select the values between '0 to 3'.
Now we add some javascript to take the values and work with them.
<input type="range" min='0' max ='3' step='1' oninput="outputUpdate(value)">
Now take an array and pass the values selected from the range.
function outputUpdate(rangeValues){
var values = ['Good','Bad','Average'];
for(var i=0; i<rangeValues; i++){
document.querySelector("#result").value=values[i];
}
}
Strictly speaking, this is not possible (see the specification).
However, you can simulate this by putting the strings into an array, and giving the slider a min value of 0, a max value of array.length-1, and a step value of 1. Then use the value of the slider as an index into the array. (It would also help your users if you displayed the strings as captions on the slider, or at least had an onchange handler on the slider that displayed the string corresponding to the slider's current position somewhere near the slider.)
