CODEWITHSUNDEEP
formsinputember.js
Pavel S.
Pavel S.

Reputation: 12361

How to get input value in Ember.js app?

What's the best solution of getting input value from Ember.TextField, after the button has been submitted?

Assume I have simple app for sending messages. I specified a view which represents input form where the user enters his message:

App.TextView = Ember.View.extend({
    templateName: 'text',

    submit: function(event) {
        console.log(event);
    }
});

Then, there is Handlebars template for this view:

<script type="text/x-handlebars" data-template-name="text">
    <h1>Send the message:</h1>
    <div class="send_form">
        {{view Ember.TextField}}
        <button type="submit">Done</button>
    </div>
</script>

Basically, I need just one thing. When the user clicks on the button, I need to be notified (in the submit function or anywhere else in my app) and I need to grab the value from the TextField. How can I achieve that?

Upvotes: 2

Views: 8388

Answers (1)

sly7_7
sly7_7

Reputation: 12011

You could for example bind the value of the text field to a message property in the view.

Perhaps there is other solution, but I think this quite simple: http://jsfiddle.net/Sly7/vfaF3/

<script type="text/x-handlebars">
  {{view App.TextView}}
</script>

<script type="text/x-handlebars" data-template-name="text">
  <h1>Send the message:</h1>
  <div class="send_form">
    {{view Ember.TextField value=view.message}}
    <button type="submit" {{action "submit" target=view}}>Done</button>
  </div>
</script>​

App = Ember.Application.create({});

App.TextView = Ember.View.extend({
  templateName: 'text',
  message: '',

  actions: {
    submit: function(event) {
      console.log(this.get('message'));
    }
  }
});

Upvotes: 10

Related Questions