prop("disabled", true); AND attr('disabled', 'disabled') is not working in chrome and firefox

Question

i have the following script inside my asp.net mvc view:-

function disableform(id) {
    $('#' + id).prop("disabled", true);
}

But the above function will only disable the elements using internet explorer ,, but will fail to work on chrome or firefox, i also tried to write attr('disabled', 'disabled') instead of .prop("disabled", true);, but it did not solve the problem.

my Jquery version is 1.7.1

So what might be the problem?

BR

Answer 1

Disabling a form is wrong! IE is just messing it out! you should disable fields.

function disableform(id) {
    $('#' + id+' :input').prop("disabled",true);
}​

DEMO

Answer 2

I run ASP.NET and had this same issue.

I ditched Jquery and went to pure Javascript and it worked great.

    var element = document.getElementById('MyID');
    element.setAttribute('disabled', 'disabled');

Edit: For this to work properly you have to use element.removeAttribute('disabled'); when enabling the element. Otherwise it remains disabled.