Balaji Ramakrishnan
Balaji Ramakrishnan

Reputation: 11

Unable to remove an item from dropdown list using javascript in Mozilla Firefox

I am a beginner to javascript. I am trying to remove few items from the dropdown list based on an option button. In firefox, I see that it is reaching the line to remove the item, but not deleting the item. Can you please help on this?

disable_dropdown_items() 
{
	var yes = document.getElementById('RadioYes').checked;
	var all_opts = document.getElementById('ALL_ITEMS').options;
	for (var i = 0; i < document.getElementById('ALL_ITEMS').options.length; i++) 
	{
		if((document.getElementById('ALL_ITEMS').options[i].value == '891') && (yes == true)) 
		{
		    document.getElementById('ALL_ITEMS').options[i].remove(i);
		}
    }
}

The line,

document.getElementById('ALL_ITEMS').options[i].remove(i);

works well in IE and chrome and removes the value "891", but firefox doesn't remove. Am I missing anything here? I have tried:

document.getElementById('ALL_ITEMS').options.remove(i);

without the index for options, still no luck.

Upvotes: 1

Views: 176

Answers (2)

Ankit Lalan
Ankit Lalan

Reputation: 1

This removes the third option i.e. Rejected

<select id="FilterByTypeTop" class="form-control">
    <option value="1">Approved</option>
    <option value="2">Not Approved</option>
    <option value="3">Rejected</option>
</select>
<script>
    $('#FilterByTypeTop').find('option[value="3"]').remove();
</script>

Upvotes: 0

Zee
Zee

Reputation: 8488

A much smaller version would be to do it like this. Use remove() on select.

function disable_dropdown_items() {
    var yes = document.getElementById('RadioYes').checked;
    var sel = document.getElementById('ALL_ITEMS');

    for (var i = 0; i < sel.options.length; i++) {
        if ((sel.options[i].value == '891') && (yes == true)) {
            sel.remove(i); //Remove from select using index
        }
    }
}

An example fiddle.

Upvotes: 1

Related Questions