0

I have multiple input text boxs all are by default read-only.

I want to Remove readonly attribute for all the input element within my form instead of particular element, i dont have any idea that with the jQuery how i can select all input and remove the readonly attributes if are added.

Html :

<input type="text" name="fistname" readonly="true">
<input type="text" name="lastname" readonly="true">
<input type="text" name="emailaddres" readonly="true">
<input type="text" name="password" readonly="true">
<input type="button" name="edit" id="edit">

Jquery :

$(document).ready(function(e){
    $(document).on("click","#edit",function(e){
         // What should i do here..?
    });
});
Punit Gajjar
  • 4,937
  • 7
  • 35
  • 70
lalitpatadiya
  • 720
  • 7
  • 21
  • `$('input').removeAttr('readonly')` https://api.jquery.com/removeAttr – B-and-P Mar 29 '16 at 06:20
  • 2
    Possible duplicate http://stackoverflow.com/questions/2496443/how-i-can-add-and-remove-the-attribute-readonly – John R Mar 29 '16 at 06:23
  • 1
    @JohnR , i guess removing readonly attribute for an individual input element and within an entire form is a different thing with selecting all the inputs using jQuery! He might not have an idea that how to select all the inputs of a form using jQuery – Punit Gajjar Mar 29 '16 at 07:02

4 Answers4

7

You should use prop() to set the properties

$(':input').prop('readonly', false)

OR, Use removeAttr() method

$(':input').removeAttr('readonly')

References

Satpal
  • 132,252
  • 13
  • 159
  • 168
0

Use removeAttr() method like following.

$(document).on("click","#edit",function(e){
    $('input[type=text]').removeAttr('readonly');

    //$(':input').removeAttr('readonly'); //if want to select all types of form controls
});
Ibrahim Khan
  • 20,616
  • 7
  • 42
  • 55
0
$('input.canEdit').attr('readonly', false);

and add a class to all input elements you wants to allow user available to edit;

itzmukeshy7
  • 2,669
  • 1
  • 21
  • 29
0
$('#edit').click(function (){
   $('input[type=text]').removeAttr('readonly');
});