jQuery

jQuery Get Textarea Value when button is clicked Examples

If you ware wondering how to find or get Textarea Value  using jQuery, then this article is for you. Many times web designers/developers happen to work with forms and at times, it might be very essential to find the textarea value. In this article, I am going to show you how to find the textarea value very easily, when button is clicked using few examples. So read on to find out more.

How to Find / Get Textarea Value using jQuery

For the sake of the example, lets assume that we have a textarea with ID “comments”. So now we will get the value entered in this textarea using jQuery. Following is the HTML source code:

<html>
<head>
<title>Example</title>
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
</head>

<body>
<form name="form1" method="post" action="">
<p>
<label for="comments">Comments<br>
</label>
<textarea name="comments" id="comments" cols="45" rows="5"></textarea>
</p>
<p>
<input type="checkbox" name="get_comm_val" id="get_comm_val">
<label for="get_comm_val">Alert Textarea Value?</label>
</p>
<p>
<input type="submit" name="sbt_get_val" id="sbt_get_val" value="Alert Textarea Value">
</p>
</form>

</body>
</html>

Example 1: Alert theTextarea Value when button is clicked

<script type="text/javascript">

$('#sbt_get_val').on("click", function(e){

var textarea_val = $('#comments').val()

alert( 'Textarea value is: \n'+ textarea_val );

e.preventDefault();

});

</script>

Example 2: Alert the Textarea Value when Checkbox is clicked

<script type="text/javascript">

$('#get_comm_val').on("click", function(e){

if( $(this).is(":checked") )
{
var textarea_val = $('#comments').val()

alert( 'Textarea value is: \n'+ textarea_val );
}

});

</script>
Easy?

Do you know of any other ways to get the textarea value using jQuery? Feel free to suggest by commenting below.

Share your thoughts, comment below now!

*

*