Appending newline to textarea with jQuery

Question

I have a Meteor application with some textareas that I want users to be able to append newlines to.

The textareas are in tds.

<td>
    <input type="textarea" class="editable-textarea" style="width: 100%; height: 100%; border: none;" id="some_id" value="some_value">
</td>

Then, I have a helper function that detects for 'enter' being hit, and then takes the current value of the textarea, and simply appends a newline to it.

'keyup .editable-textarea'(e, template) {
        if (e.keyCode == 13) {
            e.preventDefault();
            const input = e.target;
            const textWithNewLine = $(input).val();
            $(input).val(textWithNewLine+"\n");
        }
    },

I learned how to do the above using http://jsfiddle.net/Addct/ as seen in Add new line character to textarea instead of submitting form

Problem is, the newline isn't actually being appended. I'm using Chrome btw. I've tried variations of '\r', '\r\n', and '
' to no avail. Also, the cursor does not get added to the next line.

I used the Chrome console to just manually do

$('#some_id').val($('#some_id').val()+'\n')

and that doesn't even work. Furthermore, I try printing out its value after that and it doesn't even register the newline at all. It simply voids it. Spaces and other text are working though. Could this be related to using Meteor?

Any idea of what's going on or any workarounds?

Thanks

The problem seems to be that you tried to use an input element `` that does not exist. If you use `` instead everything will work fine, even without any script. — Carsten Massmann, Nov 07 '19 at 15:24
Ah, that's it. Any native way to be able to add newlines to just a regular though? — user2402616, Nov 07 '19 at 15:35
There would not be much point to it as an `` element will not be able to display a newline character within the input string. — Carsten Massmann, Nov 07 '19 at 15:42
Makes sense. Seems my browser saw the incorrect type="textarea" and converted it to "text". I'd be happy to accept this as an answer for you if you write it up. — user2402616, Nov 07 '19 at 15:45

Appending newline to textarea with jQuery

0 Answers0