jQuery .attr(“disabled”, “disabled”) not working in IE 10

Question

I'm having issues with attr('disabled', 'disabled') or prop("disabled", true) in internet explorer with jQuery In firefox, and chrome, this behaves as expected. Any ideas?

I am trying to disable an item in the dropdown list in my MVC application. It doesn't work in IE.

var count = parseInt($("#numCount").val());
    if ((isNaN(count) === false) && (count > 500)) {
        $("#ReportType option[value='Report']").attr("disabled", "disabled");
        $("#ReportType option[value='Report']").prop("disabled", true);

    }

Answer 1

This should actually work on IE 9+, maybe even IE 8.

Reasons why this may not work is when the browser is forced into IE 7 behaviour:

1. A <meta> tag may have been used to emulate IE7 (this was often done in the past for older sites to keep working).

2. Something else may have triggered quirks mode, and all bets are off when that happens.

The developer tools (F12) can help you here.

Answer 2

Try this:

http://jsfiddle.net/ChuJh/2/

$('#ReportType > option[value="Report"]').attr('disabled', 'disabled');

That works for me in IE 10, FF, etc.

Hope it helps.

Answer 3

Small possibility that parseInt is causing the problem here.

Try changing:

parseInt($("#numCount").val())

To:

parseInt($("#numCount").val(), 10)

Or:

Number($("#numCount").val())