Update textarea with value of multiple input elements

Question

This is a bit more complicated than the title says. I have 10 input elements the values of which I would like to copy to my textarea. Input field 1 is line 1, input field 2 is line 2, and so on.

I want to automatically fill out the textarea when the input fields are filled out. Text wrapping doesn't matter, so if input field 1's text is long, it may stretch to line 2 (because of text wrapping), but input field 2 should always be on a new line after input field 2. Get my point?

All of the input fields have same class, so it's easy (I guess). I just cannot wrap my head around it. I guess you can map it, and do something like this, but I'm not sure:

<input type="text" name="text[]" />

Just collect all the values in a string and everytime you add a value you add "\n" before. — AnAmuser
– AnAmuser, Commented Dec 23, 2014 at 23:14
I'm creating a generator to generate text stuff, and I need people to input whatever they want in the input fields, which will be shown in the textarea afterwards. — MortenMoulder
– MortenMoulder, Commented Dec 23, 2014 at 23:15

twinlakes · Accepted Answer · 2014-12-23 23:18:56Z

2

You said they all have the same class, so I'll call it "myClass".

var texts = [];
$('input.myClass').each(function () {
  texts.push($(this).val());
});
$('textarea').val(texts.join('\n'));

answered Dec 23, 2014 at 23:18

twinlakes

10.5k8 gold badges36 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

MortenMoulder Over a year ago

When I add that into my .keyup() function, the text gets added, but it won't work. jsfiddle explains it all: jsfiddle.net/ypLzpqkL

MortenMoulder Over a year ago

Ah nevermind. I added the "texts" variable initialization into the keyup(). Thanks!

Collectives™ on Stack Overflow

Update textarea with value of multiple input elements

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related