jQuery - how to remove all select elements
Hello Experts,
I have a simple select
<select id='myselect'>
<option...>
<option...>
</select>
To remove all the options I am calling:
$('#myselect').empty();
on the onChange. However, this is only removing the values and not the options themselves.
ie If I originally had 10 options appear in the drop down and then call this function, I still have 10 options - but they are all blank.
What am I doing wrong?
Thanks!
I have a simple select
<select id='myselect'>
<option...>
<option...>
</select>
To remove all the options I am calling:
$('#myselect').empty();
on the onChange. However, this is only removing the values and not the options themselves.
ie If I originally had 10 options appear in the drop down and then call this function, I still have 10 options - but they are all blank.
What am I doing wrong?
Thanks!
Last Comment
ASKER
Apologies, I don't think I was very descriptive - Friday 13th fever!!!
Just to be very clear on the problem:
html code:
jQuery:
The select options are simplified for this example.
However, what I want to do is remove all the options in #myselect whenever the user selects a different unit. Once removed, I want to add options to this select. The number of options added will differ to the number that are removed.
Many Thanks!
Just to be very clear on the problem:
html code:
<select id="myselect">
<option value="1">
<option value="2">
</select>
<select id="select_unit">
<option value="dollar">
<option value="pound">
</select>
jQuery:
$(function() {
$('#select_unit').change(function() {
var unit = $(this).val();
// remove all options
$('#myselect').empty();
if(unit == "dollar")
{
$('#myselect').append('<option value="1">1</option>');
$('#myselect').append('<option value="2">2</option>');
}
else if(unit == "pound")
{
$('#myselect').append('<option value="3">3</option>');
$('#myselect').append('<option value="4">4</option>');
}
});
});
The select options are simplified for this example.
However, what I want to do is remove all the options in #myselect whenever the user selects a different unit. Once removed, I want to add options to this select. The number of options added will differ to the number that are removed.
Many Thanks!
ASKER CERTIFIED SOLUTION
THIS SOLUTION IS ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
ASKER
Actually, I haven't checked the answer - but the error was in another part of my code - sorry - but thank you!
AJAX
Asynchronous JavaScript and XML (AJAX) is a group of interrelated Web development techniques used on the client-side to create asynchronous Web applications. With AJAX, web applications can send data to and retrieve from a server asynchronously (in the background) without interfering with the display and behavior of the existing page. HTML and CSS can be used in combination to mark up and style information. The Document Object Model (DOM) is accessed with JavaScript to dynamically display and allow interaction with the information presented.
13K
Questions
--
Followers
--
Top Experts
Get a personalized solution from industry experts
TRUSTED BY
Open in new window