How to get the text content inside a Text Area with Jquery using its class name

Question

I have an automatically generated textarea with a class name, say "x". How do I get the text inside the text area given that there will be only one element with the class name "x" in that page.

I have tried the following and can't make it to work.

<textarea class="note-codable" role="textbox" aria-multiline="true" style="height: 390px;">
 some content 
</textarea>

<script>
$(document).ready(function () {
  alert($('.note-codable').val());
  alert($('.note-codable').first.val());
  alert($('.note-codable').text());
})

also how do i update the same text area? any help is appreciated. thanks in advance.

Possible duplicate of [Jquery get form field value](https://stackoverflow.com/questions/11654449/jquery-get-form-field-value) — Nick Parsons, Feb 15 '19 at 09:12

score 2 · Answer 1 · answered Feb 15 '19 at 09:12

2

You Can Use:

$(selector).text() i.e

$('.x').text();

answered Feb 15 '19 at 09:12

Aayush

409
4
17

Maheer Ali · Answer 2 · 2019-02-15T09:28:51.130

1

use .val(). Its working fine

$(document).ready(function () {
  console.log(document.querySelector('.note-codable'))
  alert($('.note-codable').val());
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea class="note-codable" role="textbox" aria-multiline="true" style="height: 390px;">
 some content 
</textarea>

edited Feb 15 '19 at 09:28

answered Feb 15 '19 at 09:10

Maheer Ali

35,834
5
42
73

Hi, I have edited my question now. It still doesn't work for me. Actually I'm trying to update content to a rich text editor. there is this role="textbox" after the class name. is this what causing failure? – Arun Laxman Feb 15 '19 at 09:17
Yes. I know, I think it has something to do with the rich text editor i'm trying to play with. – Arun Laxman Feb 15 '19 at 09:39
I'm Using summernote RTE with Django. – Arun Laxman Feb 15 '19 at 09:47
@ArunLaxman buddy i just saw https://summernote.org/. Go and **inspect element** the the RTE. You will see that `` have no `innerHTML` or text. A `<div>` below it contains the the whole text. Try using `$('.note-editable').text();`</div> – Maheer Ali Feb 15 '19 at 10:03
I'm really grateful to you for going to such extreme lengths. but there's a textarea for codeview. if you inspect the codeview of Summernote, you get a textarea with note-codable class name. – Arun Laxman Feb 15 '19 at 10:06

Rohit Mittal · Answer 3 · 2019-02-22T10:05:59.567

1

check below code for this:

$(document).ready(function () {
  alert($('.x:first').html());
})

Hope it helps you.

edited Feb 22 '19 at 10:05

answered Feb 15 '19 at 09:12

Rohit Mittal

2,064
2
8
18

That's actually misleading. Although a textarea does not have a value _attribute_, it still exposes a value _property_ to be accessed with JavaScript – Psi Feb 22 '19 at 09:59
Thanks for correcting me and I have updated my comment which was misleading @Psi – Rohit Mittal Feb 22 '19 at 10:06

How to get the text content inside a Text Area with Jquery using its class name

3 Answers3