Enabling a disabled element

Question

I tried to enable a disabled element on click of a P element.The code below will store the value from the textbox into another textbox which I have appended with the div.later this textbox will be disabled.On mouse over the div an edit and delete will appear.On click of the edit, the textbox within the div must be enabled again.

<div id="ta"></div>
<input type="text" id="tb"><br>
<button onclick="add()">Submit</button><br>    

<script type="text/javascript">

var ta="";
    function add() {
        var newDiv="",newTa="",newP="",newImg="";

        ta=document.getElementById('ta');
    newDiv = document.createElement("div");

    ta.appendChild(newDiv);

    newTa = document.createElement("input");
    newTa.type="text"
        newTa.disabled="true";
        newTa.value=document.getElementById("tb").value;

        newDiv.onmousedown=function(){

        newP.style.visibility="visible";
    newImg.style.visibility="visible";  

        };


        newP=document.createElement("p");

        newP.innerHTML="Edit";
        newP.style.visibility="hidden";
        newP.style.display="inline";
        newP.style.padding="5px";
        newP.onclick=function()
        {
           newTa.disabled="false";//this is not working

        }

Why is it not working?Is there any other way to do this?

BadHorsie's answer is correct. Issues like this are often a result of confusion about the difference between HTML attributes and DOM node properties, so here's a good read: https://stackoverflow.com/questions/6003819/properties-and-attributes-in-html — Lennholm, Aug 24 '17 at 09:57
OMG I was so silly...removal of quotes works fine now..thanks — NIV, Aug 24 '17 at 09:57

score 1 · Accepted Answer · answered Aug 24 '17 at 09:52

The reason is probably because you are providing "false" as a string. From another answer here:

[...] a non empty string is truthy. So assigning "false" to the disabled property has the same effect of setting it to true.

Try using the proper boolean value instead.

newTa.disabled = false;

score 0 · Answer 2 · answered Aug 24 '17 at 09:56

newTa.disabled="true"
newTa.disabled="false"

these two should be without ""

newTa.disabled=true
newTa.disabled=false

otherwise you could do it like this:

var x = document.getElementById("mySelect").disabled;

https://www.w3schools.com/jsref/prop_select_disabled.asp

Enabling a disabled element

2 Answers2