how could i do: if in #myselect1 volvo is selected then remove 1st(740) and 2nd(940) option in #myselectVolvo
<select id="myselect1">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
<select id="myselectVolvo">
<option value="740">740</option>
<option value="940">940</option>
<option value="240">240</option>
<option value="340">340</option>
</select>
Approach: Select the option from select which needs to remove. Use JQuery remove() method to remove the option from the HTML document.
First, bind click event on the button using click . Use the :selected pseudo-selector to select the selected option from the dropdown and remove() to remove it from DOM.
The option to be removed is selected by getting the select box. The value to be removed is specified on the value selector (value='optionValue') on the select box. The remove() method is then used to remove this selected option. The find() method can be used to find the option in the value with the value selector.
If we want to remove all items from dropdown except the first item then we can use $('#ddlItems option:not(:first)'). remove(); Here we have excluded first item from being deleted. If we want to remove all items from dropdown except the last item then we can use $('#ddlItems option:not(:last)').
$('#myselect1').change(function(){
if($(this).val() == 'volvo'){ // or this.value == 'volvo'
$('#myselectVolvo option:lt(2)').remove();
}
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With