How to reset select options in jquery

Using core jQuery, how do you remove all the options of a select box, then add one option and select it? The following code was helpful with chaining. I did use the same 'value' in both. This select box is populated by a set of radio buttons. Nothing is wrong with my existing code - I am just trying to learn jQuery.

I had a bug in IE7 works fine in IE6 where using the above jQuery methods would clear the select in the DOM but not on screen. Using the IE Developer Toolbar I could confirm that the select had been cleared and had the new items, but visually the select still showed the old items - even though you could not select them.

If your goal is to remove all the options from the select except the first one typically the 'Please pick an item' option you could use:. Not sure exactly what you mean by "add one and select it", since it will be selected by default anyway. But, if you were to add more than one, it would make more sense.

How about something like:.

javascript - Reset select value to default - Stack Overflow

Can you clarify what you mean by "This select box is populated by a set of radio buttons"? Thanks to the answers I received, I was able to create something like the following, which suits my needs.

My question was somewhat ambiguous. Thanks for following up.

javascript - How to set the first option on a select box using jQuery? - Stack Overflow

My final problem was solved by including "selected" in the option that I wanted selected. I've found on the net something like below. With a thousands of options like in my situation this is a lot faster than. Uses the jquery prop to clear the selected option. By posting your answer, you agree to the privacy policy and terms of service. Stack Overflow Questions Developer Jobs Documentation beta Tags Users.

Sign up or log in to customize your list. Tour Start here for a quick overview of the site Help Center Detailed answers to any questions you might have Meta Discuss the workings and policies of this site About Us Learn more about Stack Overflow the company Business Learn more about hiring developers or posting ads with us. Log In Sign Up. Join the Stack Overflow Community. Stack Overflow is a community of 7.

Join them; it only takes a minute: How do you remove all the options of a select box and then add one option and select it with jQuery? My select box is the following. This worked for me: Martin Smith k 45 I have the same problem, but I need to add a set of checkboxes rather than one on change of dropdown but my checkboxes are coming from xml.

BrockHensley, I believe the true elegance of this answer is proper chaining in combo with the end function. Your suggestion will work as well. From jQuery API Documentation: When this happens, it is as if the new set of elements is pushed onto a stack that is maintained inside the object.

Each successive filtering method pushes a new element set onto the stack. If we need an older element set, we can use end to pop the sets back off of the stack. Refreshing the menu afterwards was also required. BrockHensley you could even go so far as. Mahzilla 5, 1 9 3.

javascript - How to set the first option on a select box using jQuery? - Stack Overflow

This worked in IE6 and FF 3. Just out of curiosity, is 'empty' faster than 'find'? Seems like it would be -- because the 'find' would use a selector and 'empty' would just brute force empty the element. DanEsparza I made you a jsperf; empty turned out faster of course ; jsperf.

I got a wierd glitch with this solution. The populate part of it is okay, but when I try to select a value in my case a day , I can console log the value, but the shown value in the select field stay in the first value I can't resolve it: Anand 3, 5 25 Shawn 1, 1 10 Shawn I know only one thing this is the far simplest solution and it works perfect.

I agree that this is the simplest solution for removing all of the options, but that only answers half of the question This fix works for IE8. If your goal is to remove all the options from the select except the first one typically the 'Please pick an item' option you could use: All others intentionally removed the first with a view of recreating it afterwards, which I don't like; it also implies that they have stored the first option somewhere first too.

How about something like: Hayden Chambers 1 4 However, it did work in FF 3. How about just changing the html to new data. Shiv 3 9 Building on mauretto's answer, this is a little easier to read and understand: This will replace your existing mySelect with a new mySelect.

Barun 1 7 Rahil Wazir 7, 11 28 HaveNoDisplayName 5, 13 20 Jaydeep Shil 4 Nadeem Manzoor 5 Russel Hussain 11 2. Sign up or log in StackExchange. Sign up using Facebook. Sign up using Email and Password.

Post as a guest Name. Stack Overflow works best with JavaScript enabled. I had to use this method in ie6 as well because. This should be the answer. We are still using IE6 and this method did not work. MathOverflow Mathematics Cross Validated stats Theoretical Computer Science Physics Chemistry Biology Computer Science Philosophy more 3. Meta Stack Exchange Stack Apps Area 51 Stack Overflow Talent.