CODEWITHSUNDEEP
javascripthtmlcheckbox
Diyan salman
Diyan salman

Reputation: 45

Read Only Text Column With Checkbox

I made a very easy one HTML input column. I added JavaScript to it with a checkbox in it. When I clicked check box checked I want write the text or unchecked the text box read only how to solve my problem. Give for example for my code

<input type="text" id="inputID" value="abc"></input>

    <input type="checkbox" id="myCheck" checked>

    <script>
   document.getElementById('inputID').readOnly = true;

    </script>

Upvotes: 1

Views: 158

Answers (1)

ztadic91
ztadic91

Reputation: 2804

Add an event listener to the change event on the checkbox.

<input type="text" id="inputID" value="abc" readonly></input>
<input type="checkbox" id="myCheck" >
<script>
    var checkbox = document.getElementById('myCheck');
    checkbox.addEventListener('change', function() {
        document.getElementById('inputID').readOnly = !this.checked; 
    });
</script>

Working fiddle

Upvotes: 1

Related Questions