CODEWITHSUNDEEP
ember.js
NicholasJohn16
NicholasJohn16

Reputation: 2409

Access Controller in a View in a Render

I have a view like this:

App.AbilityFilter = Ember.TextField.extend({
    classNames: ['span3'],
    keyUp: function(evt) {
        this.get('controller').send('filterAbilities','text');
    },
    placeholder:'Search abilities'
});

It's part of a render like this:

<script type="text/x-handlebars" data-template-name="abilities">
     {{view App.AbilityFilter}}
     <div class="accordion" id="abilities">
          {{#each ability in model}}
               <div class="accordion-group">    
                    {{ability.name}}
               </div>   
          {{/each}}
      </div>
 </script>

Which is being rendered in my application like this:

{{render 'abilities'}}

The problem I'm having is with the event or, rather, the action. The keyUp event fires perfectly well, but for some reason it won't go to a controller.

I've tried adding the filterAbilities to the actions hash on both the App.AbilitiesController and the App.IndexRoute according to this. According to this, the view should be part of the abilities controller since that's the context of it's parent, but it's not working.

I've done some testing and it almost seems like this.get('controller') isn't fetching a controller at all. I'm a bit lost as to what's causing the problem. This code worked a few RCs ago, but as soon as I upgraded to 1.0 it broke.

What I'm trying to do here is filter the list of abilities. If this isn't the way to this anymore, please let me know! Any help would be appreciated. Thanks!!

Upvotes: 2

Views: 254

Answers (1)

intuitivepixel
intuitivepixel

Reputation: 23322

Ember.TextField and Ember.TextArea are no longer simple views but rather subclasses of Ember.Component which means that this.get('controller') does not refer anymore to the views controller.

But there is a different variable which indeed holds a reference to the surrounding controller and this is this.get('targetObject'). Therefore you should send your action to the targetObject:

App.AbilityFilter = Ember.TextField.extend({
  classNames: ['span3'],
  keyUp: function(evt) {
    this.get('targetObject').send('filterAbilities','text');
  },
  placeholder:'Search abilities'
});

Hope it helps.

Upvotes: 2

Related Questions