CODEWITHSUNDEEP
javascriptjqueryhtml
user2401997
user2401997

Reputation: 287

html readonly attribute not removable

I want to remove the readonly attribute from the following input field:

<input id="cno" name="cno" type="number" class="form-control" readonly />
<button type="button" id="no-edit" class="btn btn-warning">Edit</button>

I have tried using jQuery(1.11) to remove the attribute on the click of a button.

$("#no-edit").click(function() {
   $("#cno").removeProp('readonly');
});

And I have also tried using:

 $("#no-edit").click(function() {
   $("#cno").removeAttr('readonly');
});

Please help! I don't understand why it fails.

Upvotes: 1

Views: 250

Answers (2)

Jai
Jai

Reputation: 74738

Try this:

$("#no-edit").click(function() {
   $("#cno").prop('readonly', false);
});

Demo

Upvotes: 2

Mritunjay
Mritunjay

Reputation: 25882

Wrap it on document.ready worked for me.

$(document).ready(function () {
        $("#no-edit").click(function() {
           $("#cno").removeAttr('readonly');
       });
})

Upvotes: 1

Related Questions