How do I check how many options there are in a dropdown menu?

Question

How do I check, using jQuery, how many options are there in a drop down menu?

Thanks.

score 218 · Accepted Answer · answered Jul 26 '10 at 18:26

218

var length = $('#mySelectList').children('option').length;

or

var length = $('#mySelectList > option').length;

This assumes your <select> list has an ID of mySelectList.

answered Jul 26 '10 at 18:26

user113716

318,772
63
451
440

`.children('option').length;` was the only way I could get the actual option count / select.length after I populated my select list dynamically via ajax in the .done({}); using .append(). Way to go! – yardpenalty.com Nov 10 '16 at 21:35
for the length of selected options is this correct "$('.search-select option:selected').length" – Youssef Boudaya Jun 12 '19 at 11:00
Regarding @yardpenalty.com 's response, the reason is because the .children() version parses the current DOM, while the second one with $('#mySelectList > option') parses the DOM that existed when the page was loaded. – mydoglixu Jan 10 '21 at 21:19

score 11 · Answer 2 · answered Jul 26 '10 at 18:26

11

$("#mydropdown option").length

Or if you already got a reference to it,

$(myDropdown).find("option").length

answered Jul 26 '10 at 18:26

Matti Virkkunen

63,558
9
127
159

score 9 · Answer 3 · edited Sep 21 '18 at 16:16

Use the length property or the size method to find out how many items are in a jQuery collection. Use the descendant selector to select all <option>'s within a <select>.

HTML:

<select id="myDropDown">
<option>1</option>
<option>2</option>
.
.
.
</select>

JQuery:

var numberOfOptions = $('select#myDropDown option').length

And a quick note, often you will need to do something in jquery for a very specific thing, but you first need to see if the very specific thing exists. The length property is the perfect tool. example:

   if($('#myDropDown option').length > 0{
      //do your stuff..
    }

This 'translates' to "If item with ID=myDropDown has any descendent 'option' s, go do what you need to do.

Sharjeel Aziz · Answer 4 · 2010-07-26T19:03:51.487

5

Get the number of options in a particular select element

$("#elementid option").length

edited Jul 26 '10 at 19:03

answered Jul 26 '10 at 18:28

Sharjeel Aziz

8,495
5
38
37

There is no advantage to using ".size" over ".length" which is slightly faster. – Russ Bradberry Jul 26 '10 at 18:33

score 5 · Answer 5 · edited May 23 '17 at 12:34

5

Click here to see a previous post about this

Basically just target the ID of the select and do this:

var numberOfOptions = $('#selectId option').length;

edited May 23 '17 at 12:34

Community

1
1

answered Jul 26 '10 at 18:29

Munzilla

3,805
5
31
35

score 4 · Answer 6 · answered Jul 26 '10 at 18:25

4

$('#idofdropdown option').length;

That should do it.

answered Jul 26 '10 at 18:25

Rob Stevenson-Leggett

35,279
21
87
141

score 3 · Answer 7 · answered Jul 26 '10 at 18:25

3

alert($('#select_id option').length);

answered Jul 26 '10 at 18:25

fantactuka

3,298
19
29

This will work, but not if the DOM changes after load. See accepted answer above for details. – mydoglixu Jan 10 '21 at 21:21

score 3 · Answer 8 · answered Jul 26 '10 at 18:26

3

$('#dropdown_id').find('option').length

answered Jul 26 '10 at 18:26

second

28,029
7
75
76

nicholasklick · Answer 9 · 2010-07-26T18:43:27.083

3

$('select option').length;

or

$("select option").size()

edited Jul 26 '10 at 18:43

answered Jul 26 '10 at 18:27

nicholasklick

1,212
10
14

`.size()` is useful if you want to chain – adardesign Jul 26 '10 at 19:49
.size() returns and integer and, therefore, is not chain-able. You can only chain methods that return jQuery objects. – Russ Bradberry Jul 26 '10 at 20:40

score 1 · Answer 10 · answered Nov 03 '15 at 07:35

With pure javascript you can just call the length on the id of the select box. It will be more faster. Typically with everything native javascript is performing better and better with modern browsers

This can be achieved in javascript by

     var dropdownFilterSite = document.querySelector( '#dropDownId' );  //Similar to jQuery

var length = dropdownFilterSite.length.

Good website for some learning

www.youmightnotneedjquery.com

A good video to watch by Todd Motto

https://www.youtube.com/watch?v=pLISnANteJY

How do I check how many options there are in a dropdown menu?

10 Answers10