Add text to textarea - Jquery

Question

How can I add text from a DIV to a textarea?

I have this now:

    $('.oquote').click(function() { 
      $('#replyBox').slideDown('slow', function() {
      var quote = $('.container').text();   
         $('#replyBox').val($('#replyBox').val()+quote);   
        // Animation complete.
      });    
    });

score 84 · Accepted Answer · answered Aug 14 '11 at 18:44

84

Just append() the text nodes:

$('#replyBox').append(quote);

http://jsfiddle.net/nQErc/

answered Aug 14 '11 at 18:44

AlienWebguy

76,997
17
122
145

3

This doesn't add the text in the textarea, but outside of it. – Oliver 'Oli' Jensen Aug 14 '11 at 19:03
No it doesn't :) Look at the code and inspect the element. You might be thinking of `after()` – AlienWebguy Aug 14 '11 at 19:06
Although: It add the text, but it creates many spaces. How can this be avoided? – Oliver 'Oli' Jensen Aug 14 '11 at 19:07
Hmm. Not that good with jQuery. I tried this: $('#texta').append($(jQuery.trim('#reply')).text()) But it did not work. – Oliver 'Oli' Jensen Aug 14 '11 at 19:11
What are the values of both nodes before one is appended to the other? – AlienWebguy Aug 14 '11 at 19:20
18

Use .val() not .append() or you'll face issues. – viktor_vangel Aug 02 '16 at 12:56
3

@ermenkoff is very right. I had cases where `.append()` worked and others where it was simply ignored for no obvious reason. The answer of Felix Kling using `.val()` is stable and should be preferred! – Jpsy Jun 02 '17 at 08:52
4

`append()` only works if you did not change the content of the textarea befor (e.g. by typing)!! – Marco Torchiano Jun 04 '17 at 10:25
It won't work when the textarea is already edited. https://stackoverflow.com/questions/4722914/jquery-append-not-appending-to-textarea-after-text-edited – Nathan Do Jun 20 '17 at 02:16
I had to use `.text()` instead of `.val()` otherwise it just kept appending even though I had reset the contents completely. – brandito Nov 08 '19 at 00:10

score 52 · Answer 2 · answered Aug 14 '11 at 18:51

52

That should work. Better if you pass a function to val:

$('#replyBox').val(function(i, text) {
    return text + quote;
});

This way you avoid searching the element and calling val twice.

answered Aug 14 '11 at 18:51

Felix Kling

795,719
175
1,089
1,143

5

@AlienWebguy: Better than `$('#replyBox').val($('#replyBox').val()+quote);` because it does not search the element and call `val` twice. – Felix Kling Aug 14 '11 at 18:55

Add text to textarea - Jquery

2 Answers2

Linked