How to add a “readonly” attribute to an ?

How to add a “readonly” attribute to an ?

How can I add readonly to a specific ? .attr(‘readonly’) does not work.


Solution 1:

jQuery <1.9

$('#inputId').attr('readonly', true);

jQuery 1.9+

$('#inputId').prop('readonly', true);

Read more about difference between prop and attr

Solution 2:

Use $.prop()



Solution 3:

Readonly is an attribute as defined in html, so treat it like one.

You need to have something like readonly=”readonly” in the object you are working with if you want it not to be editable.
And if you want it to be editable again you won’t have something like readonly=” (this is not standard if I understood correctly). You really need to remove the attribute as a whole.

As such, while using jquery adding it and removing it is what makes sense.

Set something readonly:

$("#someId").attr('readonly', 'readonly');

Remove readonly:


This was the only alternative that really worked for me.
Hope it helps!

Solution 4:

.attr('readonly', 'readonly') should do the trick. Your .attr('readonly') only returns the value, it doesn’t set one.

Solution 5:

I think “disabled” excludes the input from being sent on the POST

Solution 6:

You can disable the readonly by using the .removeAttr;