Update value of a textarea


#1

In order to have 1-way data flow, I’m using a <textarea> element directly instead of the {{textarea}} helper. After I type text into the textarea, though, I’m not able to declaratively update the text!

I can start with a default value, like this: <textarea>{{name}}</textarea>

As long as I don’t type into the textarea, I can change the “name” property and it will update the textarea text automatically. Once I type into the textarea, though, the textarea doesn’t get updated when I change the “name” property.

I suspect this is because of the JavaScript “value” property on the textarea, but this same exercise works with an input tag. Any ideas of how to keep 1-way data flow but get this to work? I could probably change the JavaScript value property of the textarea when the property changes, but that feels like I’m forcing it when it should just update.

Ember twiddle: https://ember-twiddle.com/0bc580c454ea7f9d25d2aeae626845a1


#2

Well how about that – doing <textarea value={{name}}></textarea> instead of <textarea>{{name}}</textarea> seems to have solved this! Though that’s unexpected since the same thing doesn’t work in plain html (setting value attribute doesn’t set textarea’s text).


#3

Hi skittem,

You can use default handlebar textare as follow :

{{textarea type='text' value= name rows=6 class='form-control'}}

But, If you want to use

<textarea>{{name}}</textarea>

Write it as

<textarea type='text'>{{food}}</textarea> It will bind correctly.


#4

Same bits here: Why on second click I cannot change textarea ? :frowning:


#5

it should change, what is the exact scenario you looking into?