3

I used to have a jQuery app, that had a keydown event once the document was ready. Basically, anytime a user hit a key, it would match the keycode and do something. Now I ported this app to Ember and life became difficult for 2 reasons:

  1. The only time a keyDown event can be registered is when the containing element/View has a focus on it. The only way this can be done with non-input fields is by setting the tabindex value, to achieve this, I do this:

    didInsertElement:function(){ this.$().attr("tabindex",0); this.$().focus(); //bringing focus to the view in order to ensure keyDown event is triggered :) },

     keyDown:function(event){
         var keycode = event.which || event.keycode;
         switch(keycode){
                //perform various events
         }
 }

  2. So the above works like a charm, except, it creates an ugly highlighted focus on the application and whenever the application loses focus, the keyDown events do not trigger. I need to explicitly click around the ApplicationView area (which is not the entire body).

All I really want is to have a simple keydown event triggered the same way it was when I had this in jQuery. Any body got ideas what's up?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Parijat Kalia
  • 4,929
  • 10
  • 50
  • 77

1 Answers1

0

Ember specifically only catches events that happen within the scope of the ember app, so if you want to catch events external to your app (since your entire page isn't an ember app), and not have to have focus on ember you'll have to create those events outside of the scope of ember.

Kingpin2k
  • 47,277
  • 10
  • 78
  • 96
  • Nope, the entire page is an EmberApp. There has to be a way that the Ember will allow you to register a DOM events that are of a global nature. – Parijat Kalia Dec 02 '13 at 19:56
  • Sorry this statement made me think it was only a portion of the page 'So the above works like a charm, except, it creates an ugly highlighted focus on the application and whenever the application loses focus, the keyDown events do not trigger. I need to explicitly click around the ApplicationView area (which is not the entire body).'. Maybe you could explain what you mean by it – Kingpin2k Dec 02 '13 at 20:09
  • Yea, I instantiate the app like App = Ember.Application.create(), & the View like App.ApplicationView = Ember.View.extend({//keydown operation noted here}). So nothing out of the ordinary, it is just how most tutorials state. In accordance, a div tag is created which I believe is the main view, maybe if we could let the body or document become the ApplicationView instead of a div tag, it would allow a keyDown operation that is truly global ?? – Parijat Kalia Dec 02 '13 at 20:35