Tue. Jun 6th, 2023

[ANSWERED] javascript – set the value read-only by java script in input

By

Nov 20, 2022 html, javascript

Solution 1 :

Set attributes like this

start.setAttribute('readonly',true)

function func()
{
var selectboxlist=document.querySelector('select');
if (selectboxlist.selectedIndex == 2 || selectboxlist.selectedIndex == 13 || selectboxlist.selectedIndex == 14) {   
var start=document.querySelector('.start')
            start.value = "00:00";  // works
            start.setAttribute('readonly',true)  // doesnt work
            console.log(start)
        }
        }

<input type="time" class="start" />


<select class="selectboxlist" onchange="func()">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
</select>

Solution 2 :

You can get the input element and then set its readOnly property to true:

document.querySelector('.input').readOnly = true;

Problem :

How can i set the value read-only by java script in input html (by class read)?

HTML

<input type="time" class="start" />

<select class="selectboxlist" >
<option>
<option>
<option>
<option>
...
</select>

Tired following in Java Script

if (selectboxlist.selectedIndex == 2 || selectboxlist.selectedIndex == 13 || selectboxlist.selectedIndex == 14) {         
            start.value = "00:00";  // works
            start.setAttribute.readonly = true;  // doesnt work
        }

Comments

Comment posted by RobG

setAttribute

By

Related Post

[ANSWERED] html – Child div has an offset border

Nov 20, 2022

[ANSWERED] html – bootstrap mobile menu not scrolling instead the background is scrolling

Nov 20, 2022

[ANSWERED] problem in selecting list item in html/css

Nov 20, 2022