Hritika Agarwal
Hritika Agarwal

Reputation: 25

How to remove css style on button click in javascript?

I have created an form in which I have made the input field disabled by default->

<input class="name"  type="text" maxlength="50" value="Hritika Agarwal" disabled="" />

I want to make this editable on button click. So created a button like this ->

 <button class="accept-btn" onclick="myFunction()">Edit</button>


   function myFunction() {
   document.getElementById("name").removeAttribute("disabled");
   }

But It's not working.

I have even tried like this also->

     function myFunction() {
    document.getElementById("name").style.disabled = "false";
    }

But again nothing happened. How could I resolve this>

Upvotes: 1

Views: 952

Answers (3)

Fir3
Fir3

Reputation: 148

if you want to select elemnt by class name use getElementsByClassName.

document.getElementsByClassName("name")[0].disabled = false;

If

select elemnt by id use getElementById.change input to

<input id="name"  type="text" maxlength="50" value="Hritika Agarwal" disabled="" />

then

 document.getElementById("name").disabled = false;

Upvotes: 1

Canopus
Canopus

Reputation: 595

 function myFunction() {
   document.getElementsByClassName("name")[0].removeAttribute("disabled");
 }

Or

<input class="name" id="name"  type="text" maxlength="50" value="Hritika Agarwal" disabled="" />

Upvotes: 2

Paflow
Paflow

Reputation: 2347

You use getElementById to find an element with the id name but there is not such thing. Use <input id="name" instead of class, then the first will work.

The second can not work, since disabled is not a style-property.

Upvotes: 2

Related Questions