Vivek Dhiman
Vivek Dhiman

Reputation: 1997

Unable to get textarea value

I am using onClick event to get the value from text area. If i use below code it returns html not the value as below :

$(this).find(".button2").click(function($e) {
    var comment_content = $(this).find('textarea[name="comment_content"]').val();
    console.log(comment_content);
});

output :

<textarea class="styledtextarea" id="comment_content" name="comment_content" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';"></textarea>

Even If i give any any value in text area still i see empty.

Here is my html :

<div class="">
<div class="">
<form id="" class="">
<div class="">
    <p></p>
    <div id="" class="">
        <div class="" style="">
        </div>
    </div>
</div>
<div id="" class="">
    <p><b></b></p>


        <textarea class="styledtextarea" id="comment_content" name="comment_content" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" ></textarea>

        <a  href="#" class="button2" type="submit"><span><b>Send<b></span></a>

    </form>
</div>
</div>
</div>

Upvotes: 0

Views: 1100

Answers (3)

Deepak Kushvah
Deepak Kushvah

Reputation: 278

Please try below

   var comment_content = $(this).find("textarea#comment_content").val();

Upvotes: 0

HaukurHaf
HaukurHaf

Reputation: 13816

According to your JS code, the textarea is a child element of the button, which I'm sure is not the case.

Try this code instead (don't use the .find() method on $(this) to find the textarea):

$(this).find(".button2").click(function($e) {
                        var comment_content = $("#comment_content").val();
                console.log(comment_content);

});

Upvotes: 0

Lucian
Lucian

Reputation: 644

When you use this in the click callback function you are referencing the object that triggered the click event, in this case .button2.

When you do var comment_content = $(this).find('textarea[name="comment_content"]').val(); you are actually searching for textarea[name="comment_content"] in the .button2 element.

What you need to do is this:

$(".button2").click(function($e) {
    var comment_content = $('textarea[name="comment_content"]').val();
    console.log(comment_content);
});

Upvotes: 3

Related Questions