Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cancel action in Ember TextView with escape key

How can I make Ember trigger a controller action when the user presses the escape key in an input field?

Given the following application code:

App = Ember.Application.create();

App.IndexRoute = Ember.Route.extend({
  model: function () {
    return {foo: "bar"};
  }
});

App.IndexController = Ember.ObjectController.extend({
  actions: {
    done: function () {
      console.log("done");
    },
    cancel: function () {
      console.log("cancel");
    }
  }
});

And the following HTML:

<body>
  <script type="text/x-handlebars" data-template-name="application">
    {{outlet}}
  </script>
  <script type="text/x-handlebars" data-template-name="index">
    {{input value=foo action="done" cancel="cancel"}}
  </script>
</body>

I would expect the cancel action in the controller to be triggered, but what I get is an error: Property 'cancel' of object [object Object] is not a function.

Here's a JSBin with the above code to illustrate. How can I make this work?

like image 977
Martin Solli Avatar asked Nov 12 '13 10:11

Martin Solli


1 Answers

It's not very documented, but seeing the code... https://github.com/emberjs/ember.js/blob/v1.1.2/packages/ember-handlebars/lib/controls/text_support.js#L106-L117

You should define you handlebars like this

{{input value=foo enter='done' escape-press='cancel'}}

JsBin http://jsbin.com/ObucELO/1/edit

like image 56
Edu Avatar answered Nov 15 '22 07:11

Edu