#1
by
AndreL
I have seen other projects using form widgets such as 'radioSelectHorizontal' Is there a fully comprehensive list of widgets implemented in oTree, or will any wtforms widget work that way. (If I may leave a wish-list contribution for future versions, Streamlit Input Widgets would be very useful for a modern feel and look - https://docs.streamlit.io/library/api-reference/widgets )
#2
by
Chris_oTree
The only form widgets you can explicitly select are RadioSelect and RadioSelectHorizontal (instead of drop-down list). Apart from that, widgets are automatically determined based on the field type (e.g. LongStringField uses a text area).
#3
by
Chris_oTree
By the way I don't recommend using wtforms widgets. oTree uses wtforms internally, but using wtforms directly may malfunction, either in the current release or when you upgrade to a new release.
#4
by
AndreL
Thanks, Chris. I specifically need a numerical input with signs (or arrows) + and - that participants can click to change the default value in fixed steps (e.g. 0.05 units). I saw some slider implementations directly on HTML (with NoUIslider). Do you have any suggestions instead of Streamlit or wtforms widgets?
#5
by
Chris_oTree
You can do this with plain HTML/javascript. Assuming you have a field called 'xyz': {{ formfields }} <button type="button" onclick="decrement()">-</button> <button type="button" onclick="increment()">+</button> <script> let xyz_value = 0; function increment() { xyz_value += 0.05; draw(); } function decrement() { xyz_value -= 0.05; draw(); } function draw() { forminputs.xyz.value = xyz_value.toFixed(2); } forminputs.xyz.readonly = true; draw(); </script>