Trying to allow a user to define a min and a max value via text inputs that are of input type number, then dynamically define the min and max for a slider using those values.
It works to initially configure, but as soon as I modify either the min or the max, the slider doesn’t work and when I return to configure it, it claims “The value has to be of type number, you provided a value of type string”.
Should be easy to reproduce by creating two text inputs and a slider and doing what I did above.
Seems like a bug, or else there’s some trick to making this work?
Hi @scottcressman, I think there’s a chance that even though the textinput is of type “number”, it’s value is still read as a string. If you set the max/min values of the slider to {{ +textinput1.value }} it should force that value to a number.
Short list of useful data type conversions:
Number: +value, Number(value)
Boolean: !!value (read Not Not value, !value will give the opposite truthiness), or Boolean(value)
String: value.toString(), String(value), or JSON.stringify(value) for objects and saving JSON to a db
Hi @scottcressman! That setup was working for me. You specifically have the + in the textinput.value? I think Number(textinput1.value) would also work.
Ah sincerest apologies - I missed the “+” in your explanation as I was reading on mobile. I added your suggestion and it worked. Thank you so much! (and good to know there are multiple ways to force the type to be a number - also very helpful!)
Happy to help! There are several situations where the data type of a value could get changed depending on how it is referenced or one which component it is loaded into. I’ll update that answer above to include some other useful data type transformations