How to retrieve selected value from <select> element?

  • J.ulian

    10 days ago

    event.target does not provide any data. Therefore, I should be able on change event to (query)select the element and get the current selected value. Cannot find an easy native solution in Toddle, while I do think this is a common usecase. Have set the array index as value attribute via repeater function. I was unable to set an ID for the <select> element.
    1
  • You can use the input or change events for the select element
  • Set the value to pass along on the <option> element
  • It's fine to repeat the option element over an array
  • J.ulian

    10 days ago

    What do you mean by this?
  • Lucas G

    10 days ago

    The option element is what sets the options for the select element
  • The select element passes the option's value when a choice is made
  • The input/change event is set on the <select> element but the value passed is set on the <option>
  • /attachments/1325220582215647332/1325224599713091644/image.png

    J.ulian

    10 days ago

    Mmmm...
    My select element has the event listener on change and the options have the index as an attribute.

    But on change I need to retrieve that attribute of the selected option. How do I target this?
    image.png
  • Lucas G

    10 days ago

    What do you mean it has it as attribute
  • Use the value attribute on the option element
  • J.ulian

    10 days ago

    Each option has an attribute value="${index}", where index corresponds to the array position
  • J.ulian

    10 days ago

    OK. Not sure what was the issue. Apparently the variable was not updating but now is...
    Problem miraculously solved 🧙‍♂️
    Thanks for your time, Lucas.
    👍1

Stop scrolling. Start building.

toddle is a visual web app builder that rivals custom code — but accessible to your entire team!

Try toddle — it's free!

© Copyright 2024 toddle. All rights reserved.