Menu
how can I reset multiple textareas to their default values (texts)? Is it possible without giving them specific class? I found only solution for one text input, but no successful with multiple textareas on 1 page, reseted by function.
<html>
<body>
<textarea rows="1" cols="30">Hello World</textarea><br/>
<textarea rows="1" cols="30">Hello Second World</textarea><br/>
<button onclick="reset()">Reset</button>
<script>
function reset() {
document.querySelectorAll('textarea').value = <!--Default Value-->
}
</script>
</body>
</html>
963
asked Apr 16 '26 19:04
How about something like this?
Address:<br>
<textarea id="myTextarea">
342 Alvin Road
Ducksburg</textarea>
<textarea id="myTextarea2">
Value 2</textarea>
<p>Click the button to change the contents of the text area.</p>
<button type="button" onclick="myFunction()">Try it</button>
<script>
function myFunction() {
document.getElementById("myTextarea").value = "Txt1";
document.getElementById("myTextarea2").value = "Txt2";
}
</script>
According to MDN, textarea does not have a value property.
When the page loads the default value for a textarea is whatever the value in between some value. Therefore when the user changes it we don't have a way to find the original value.
To Overcome that we need somekind of a mechanism to store the default value
In your case if you have a lot of elements (Textareas), using a data attribute will help us to identify the default value after the page loads and the user changes the values
So use the following example
<textarea rows="1" cols="30" data-default="Default Val">Hello World</textarea><br/>
<textarea rows="1" cols="30" data-default="Default Val1">Hello World</textarea><br/>
<textarea rows="1" cols="30" data-default="Default Val2">Hello World</textarea><br/>
<button onclick="reset()">Reset</button>
<script>
function reset() {
var textareas = document.querySelectorAll('textarea');
for(i =0; i < textareas.length; ++i){
textareas[i].value = textareas[i].getAttribute('data-default');
}
}
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With