Updating textbox value when Slider data is changed and vice versa

Hello there,

I have tried using the slider widgets you provide and they all work fine. I wanted to know whether it's possible to have an additional text box field next to the slider that updates itself as the slider is moved back or forth. I would also like to do the opposite, so that a number is put in the text box and the slider adjusts accordingly. With which widget would this be possible? Thank you

Update: I am now set on using the widget 'Slider'. Additionally I have created a text box (with numerical entries allowed only, named 'numbers').

I have set up a condition using 'update a form field value', and set it in the following way:

IF slider is FILLED

SLIDER

output to field

NUMBERS

Now when I slide the slider, the 'numbers' text box updates automatically, which is great! However, I also want to be able to do the opposite, so that when the numbers in the 'numbers' box are changed, the slider position changes too. Could you please help me with this? :) It is highly appreciated!

Kind regards

Hi, 

Before you posted your answer, I created a demo that has a condition exactly like that. However, it is now irrelevant because you've already discovered it. 

Unfortunately, you cannot include  the slider widget as an output in the calculation. So your 2nd inquiry is not possible.

Cheers!

Hi Jan,

Thank you for your reply. Is there a workaround? Possibly creating your own slider or something in that direction? I ask because it is quite odd for a visitor to enter a number in the text box while the slider stays stuck on another random number.

Many thanks

Hello there,

If that's the case then I would recommend you making the result text box not editable. You can do that by enabling the "Read Only" mode in the specific text box field.

Thanks!

Hi Jan,

Thanks for your reply. However this would not be possible as a specific number of words must be selected, hence a text box in order to fill in numbers is a must...

Hi,

Unfortunately, that is not possible in the form builder. If you know Javascript, you can do this in the form source codes: http://www.jotform.com/help/104-How-to-get-the-Full-Source-Code-of-your-Form.

I've found the following examples:

http://stackoverflow.com/questions/23229518/jquery-update-sliders-value-on-text-field-change

http://stackoverflow.com/questions/13475016/how-to-update-html5-range-on-change-of-a-text-input

Let us know if you need further assistance.

Thanks