Disable select options based on value *through the HTML only!*

Question

I need to disable a select option based on the value of a variable. The value is similar to one of the select option value and it needs to be disabled.

For ex,

Answer 1

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

Answer 2

Let's say you had the following markup

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

Using this jQuery, the saab option would be disabled.

$("select option").each(function() {
    var $thisOption = $(this);
    var valueToCompare = "saab";

    if($thisOption.val() == valueToCompare) {
        $thisOption.attr("disabled", "disabled");
    }
});

Try it out here

Answer 3

This should be a faster solution

$('select').children('option[value="' + $variable + '"]').attr('disabled', true)

Answer 4

With your current markup this will work:

$("select option:contains('Value b')").attr("disabled","disabled");

http://jsfiddle.net/CtqC6/

EDIT

http://jsfiddle.net/CtqC6/1/

var variable = "b"
$("select option:contains('Value " + variable + "')").attr("disabled","disabled");
$("select").prop("selectedIndex",-1)