<div class="club_member">
<input type="text" size="5" onclick="this.value=''" name="scienceClub" value="2">
</div>How can I use a simple javascript command to change the value to "0" and place a 'disable=""' in the input style?
4 Answers
Use object.value to set the value and object.disabled to disable the input in Javascript.
Demo:
document.getElementById("button").addEventListener("click", function(){ // I have added a sample button for testing
var inputElementObject = document.getElementById("input"); // get the input element object
inputElementObject.value = "0"; // set the value
inputElementObject.disabled = true; // set the disabled property
});<div class="club_member">
<!-- set an ID for the input element -->
<input type="text" size="5" onclick="this.value=''" name="scienceClub" value="2" id="input">
<button id="button">Click me!</button>
</div>Check out how to set the properties for <input> here on MDN.
2 Comments
warholzz116
I like the idea of you putting it in a button. And thank you so much. I didn't put an id to the input. Instead I did this. document.getElementsByName("scienceClub")[0].value = "0"; document.getElementsByName("scienceClub")[0].disabled = false;
Rahul Desai
@warholzz116 Thank you. I figured it would be helpful for the demo. :) If you found this answer good enough, please mark it as accepted.
First set id in your control like this
<input type="text" id="myControl" size="5" onclick="this.value=''" name="scienceClub" value="2">
Then Try like this in script
var control=document.getElementById("myControl");
control.value=0;
control.setAttribute("disabled", true);
1 Comment
warholzz116
Thank you. But instead of setting an id, I've used getElementsbyName("scienceClub")[0];
The below snippet demonstrates how to change the value and disable the input using strictly JavaScript.
document.getElementById("input").value = "0";
document.getElementById("input").disabled = true;<div class="club_member">
<input type="text" size="5" onclick="this.value=''" name="scienceClub" value="2" id="input">
</div>
Comments
Using the same code as you posted. you just have to change its value and it gets disabled.
<div class="club_member">
<input type="text" id='something' size="5" onclick="this.value='0'; this.setAttribute('disabled','true');" name="scienceClub" value="2">
</div> <div class="club_member">
<input type="text" id='something' size="5" onclick='this.value="0"' name="scienceClub" value="2">
<button onclick="document.getElementById('something').setAttribute('disabled','true');"> Lock the value </button>
</div>
valuenordisabledare styles, they are attributes or properties of theinputelement.