添加过滤器按钮对条目进行排序

Question

So I have this query that pulls the data for me:

App.ListRoute = Ember.Route.extend({
model: function() { return $.getJSON('php/getlines.php'); }});

And I have in my handle bar this code to display it:

<tbody>
{{#each content}}
{{view App.lineItem contextBinding="this"}}
{{/each}}
</tbody>

I was thinking of making my html fields a button which when clicked would sort the entries:

<th class="center"{{action 'sortBy' 'invoice'}}>Invoice</td>

where there is a sort by function:

sortBy: function(property) {
  this.set('sortProperties', [property]);
  this.set('sortAscending', !this.get('sortAscending'));
 }

However, I keep getting this error:

Error: Nothing handled the event 'sortBy'.

I am not sure how I can have the entries sorted if I click that button?

Answer 1

in the each loop, mention itemController="ListsController" and write the sortBy function in the ListsController.

Bascially with this you are indicating which controller the action should bubble up.

Answer 2

As @Ajey mentions, you have to create a ListsController with a sortBy action. sortBy is already defined for ArrayController (see http://emberjs.com/api/classes/Ember.ArrayController.html#method_sortBy ) but I'm pretty sure adding an action of the same name won't override it.

App.ListsController = Ember.ArrayController.extend({
  actions: {
    sortBy: function(property) {
      this.set('sortProperties', [property]);
      this.set('sortAscending', !this.get('sortAscending'));
    }
  }
});