Working with Select, Option, and Optgroup in HTML and JavaScript

26,969

450 0

Published 2020-09-23

This tutorial outlines how you can work with the Select, Option, and Optgroup elements in HTML as well as in JavaScript.
Data types for ALL HTML form elements is also discussed.

Code from video: gist.github.com/prof3ssorSt3v3/98e8466a2f2be4f6c53…

All Comments (21)

@TheLuckyyy13 1 year ago

I thought i'd have to look into this select element for quite a while before figuring how to properly use it in javascript. I came across your video and 10 minutes later my problem was solved. Thank you
@antrahagure5372 4 months ago

I corrected my mistake, all good now. Thank you very much!
@benitto_rajf6178 3 years ago

Nice one Steve. The way you explained Js is awesome
@BetYouHateMeNow 1 year ago

thank you for being the only resource on the internet that explains it so well
@mouradelcadi 3 years ago

Mr Steve I want to say thank you so much for all the videos and the content you produce thank-you so much
@cloudkungfu 3 years ago

Thanks much for a next awesome tutorial! I always learn something new watching these ⭐
@erischerub5036 2 years ago

man, rlly ty! I've been searching this since hours, and only u resolved my problem
@timlopes9666 2 years ago

Wow man ! You do explain things very clearly and good teaching method Keep it up.. Thank you
@pellegrinoernesto 2 years ago

Hello sir, you saved my day. I was stuck on getting the values of all selected options. After 3 days of cursing everything and everyone, I found out that I wrote "select.selectedOption" instead of "select.selectedOptions". 😐 Now everything works 😁 Thanks
@dustinbest1326 1 year ago

Super helpful. Thank you!
@jeanmarcpourchel307 3 years ago

Vers good as always....very smart tip ( [].map.call.....) . Perfect! And as always thanks for teaching!
@christophercuevasperez3180 2 years ago

Such a great channel! Already suscribe!
@DmitriyMalayevProfile 3 years ago

Awesome new resolution :)
@MuhammadAdnan2.0 3 years ago

Well explained...
@dagmawithailemichael6055 2 years ago

thank you Steve nd bless youuuuu
@F4ILCON 3 years ago

Great tutorial, would be great if you can do an complete form submition object with all html elements, radio, checkbox, 👋
@hamedbahram 3 years ago

You can also use Array.from() in this case, I find it a bit easier: Array.from(arrayLikeObject) let selected = Array.from(event.target.selectedOptions) let choices = selected.map(option => option.value) to even be more concise, you can send the map function as the second argument to Array.from() Array.from(arrayLikeObject, mapFunctionn) let choices = Array.from(event.target.selectedOptions, option => option.value)
@allandavies4483 1 year ago

Thanks!
@blessinagolle1473 1 year ago

I have converted json into table using javascript ..so, I already have the table,th, & td elements..so how can i add dropdown filter to my table ? without adding all the elements staticly ..?
@antrahagure5372 4 months ago

Group project will be successful thanks to your guidance. The only error I get is that "delectedOptions are not defined" . I have then in my HTML file under