I have a couple of forms that were developed with the classic designer where we were using sliders which worked great, but it involved the use of jquery widgets that I don't think is possible to implement in the modern designer. Would be nice if it does get implemented as a native field type to have precise control over the range of values that can be selected via the handle.
Question
Question
Enhancement Request: Add 'Slider' as an available field on Laserfiche Forms
Replies
I agree this would be a great addition!
You could create these sliders on your own with custom html, but they would be purely informational. If these ranges are being adjusted by a user and you need the values that is something we would have to add separately. I will track it, but I am more inclined to go with a custom html route giving designers control over input values than adding it as a field type. I will check with the team on it though!
Curious, what are you using the sliders to indicate on the form?
I was able to create the sliders with html but obtaining the changed slider value and displaying it was the part that I did not think was possible. I am able to console log when the slider changes using the window object but that was about it. We are using sliders in a couple of our forms - one for providing ratings based on the fibonacci sequence and using images to better help the end-user make an informed decision. And we are also using sliders on another form to give it more of a visual and interactive appeal
Ya unfortunately we sanitize the event and the target value is lost in that process. I do want that to be fixed (and its a smaller effort than adding an input type to the form field) so it could serve as a stop gap until we have more out of the box component types
That would be amazing! Thank you for the reply
Heya Brandon,
This would be a great field to have natively in Laserfiche. I've recently played around with having sliders and using just a basic script for each slider in a HTML field to pass the value to a hidden single line field so it can be used elsewhere.
Here's the script wrapped for a HTML field:
<script> var sliderQ1 = document.getElementById("myRangeQ1"); var outputQ1 = document.getElementById("Field39"); outputQ1.value = sliderQ1.value; sliderQ1.oninput = function() { outputQ1.value = this.value; } </script>
And here's the slider itself:
<div class="slidecontainer"> <input type="range" min="1" max="10" value="5" class="slider" id="myRangeQ11" aria-valuemin="1" aria-valuemax="10"> </div>
It works fine for what we're using sliders for, except for the issue that I'm not sure how to pass the value back to the slider if the form is assigned as a task after submitted. To get around this I just use basic variables in place of the slider wrapped in a HTML div with styling.