In this guide, you will learn how to set or change the textbox value dynamically in Jquery.
It’s very common that in the form you have textbox and you need to set its value dynamically.
Let’s get started!
Table of Contents
Step 1: Create the textarea field
Create the new textarea field in body tag of the html. I have given it an id of textfield.
<textarea name="" id="textfield" cols="30" rows="10"></textarea>
Step 2: Include the jquery
After the body tag, include the jquery CDN.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js
">
</script>Step 3: Set the value of textarea
After the include of jquery, add the following code:
$('#textfield').val('This is the value of textarea');In the above code #textfield is the id of the textarea and we are setting its value to “This is the value of textarea”.
Full Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<textarea name="" id="textfield" cols="30" rows="10"></textarea>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js
"></script>
<script>
$('#textfield').val('This is the value');
</script>
</html>
Conclusion:
Hope you have learned today how to set or change the textarea value dynamically in jquery.
Let me know if you have any comments.
See you in the next guide.
Write a Reply or Comment