Add action to enter in ember textarea input helper

Question

I have used addon ember-autoresize for my textarea to resize my textarea.

{{textarea type="text" placeholder="Comment" value=comment_text autofocus="autofocus" rows=1 max-rows=4 autoresize=true 
      enter="commentSave"}}

I want to trigger the action when user press enter.But it moves to next line when I press enter.How do I call the action when enter key is pressed in textarea.

Why not just use `input` if you don't need multiple lines of text? — Daniel Kmak, Jan 25 '16 at 10:47

score 3 · Answer 1 · edited May 23 '17 at 11:47

3

Create component called custom-textarea.

in components/custom-textarea.js:

export default Ember.TextArea.extend({
  didRender() {
    this.$().keypress(function(event) {
      if (event.keyCode == 13) {
        event.preventDefault();
      }
    });
  }
});

In template, use custom-textarea instead of textarea:

{{custom-textarea type="text" placeholder="Comment" value=comment_text autofocus="autofocus" rows=1 max-rows=4 autoresize=true 
      enter="commentSave"}}

See WORKING DEMO.

Approach to prevent default behavior taken from this answer.

edited May 23 '17 at 11:47

Community

1
1

answered Jan 25 '16 at 10:51

Daniel Kmak

16,209
7
65
83

1

You can also declare a keypress property. ``keypress(event){ ... }`` – Martin Malinda Jan 26 '16 at 16:05

Add action to enter in ember textarea input helper

1 Answers1