Disable all select options on page with specific value - Javascript [duplicate]

Question

I am trying to disable all options in all select boxes with specific value on page.

If there are 5 select boxes and each have 4 options. Like this:

<select> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <select> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <select> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select>

I want to disable all options with value 3 on whole page, how would i achieve this?

$("select option["+previous+"]").attr('disabled', 'disabled');

But this is disabling Select option with selected value 3.

Any help will be appreciated.

@Satpal suggested $("select option[value="+previous+"]").prop('disabled', true); — mplungjan
– mplungjan, Commented Sep 22, 2017 at 14:02
I like this one: var previous = 3; $('select option') .filter(function(i, e) { return $(e).val() == previous }) .prop('disabled', true); — mplungjan
– mplungjan, Commented Sep 22, 2017 at 14:07

Suresh Atta · Accepted Answer · 2017-09-22 13:57:45Z

2

Looks like whatever you passing treated as a index of inside select. Try value attribute selector

$("select option[value ="+previous+"]").attr('disabled', 'disabled');

answered Sep 22, 2017 at 13:57

Suresh Atta

122k38 gold badges206 silver badges315 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

mplungjan Over a year ago

prop("disabled",true)

Himanshu Upadhyay · Accepted Answer · 2017-09-22 13:57:56Z

You can do it using value attribute in jquery.

$("select option[value='3']").attr('disabled', 'disabled');

Shiladitya · Accepted Answer · 2017-09-22 14:00:09Z

Here you go with a solution using ES6 template literal

var previous = 3; $(`select option[value=${previous}]`).prop('disabled', true);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <select> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <select> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select>

Hope this will help you.

Collectives™ on Stack Overflow

Disable all select options on page with specific value - Javascript [duplicate]

3 Answers 3

1 Comment

Comments

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Linked

Related