title: Unable to Alter Model Data Using Ember API Kit
body: <p>I have been trying to learn the fundamentals of Ember for a couple weeks now, and I am currently running into a problem when it comes to altering data in my model via an action in the controller.</p>
  
  <p>All of the examples that I have found seem to be using one-dimensional fixtures. The fixtures I'm using look like this:</p>
  
  <pre><code>App.ClassGroup = DS.Model.extend({
      className: DS.attr('string'),
      isActive: DS.attr('number'),
      students: DS.hasMany('Students',{async:true}),
      selected: DS.hasMany('Students',{async:true})
  });
  
  App.ClassGroup.FIXTURES = [
      {
          id: 123,
          className: 'Class 1',
          isActive: 1,
          students: [11, 22, 33, 44, 55],
          selected: [11, 22, 33, 44, 55]
      },
      {
          id: 456,
          className: 'Class 2',
          isActive: 0,
          students: [66, 77, 88, 99],
          selected: [66, 88, 99]
      },
      {
          id: 789,
          className: 'Group 1',
          isActive: 0,
          students: [77, 22],
          selected: []
      }
  ];
  
  App.Students = DS.Model.extend({
      first: DS.attr('string'),
      last: DS.attr('string'),
      classes: DS.hasMany('ClassGroup')
  });
  
  App.Students.FIXTURES = [
      {
          id: 11,
          first: 'Student',
          last: 'One',
          classes: [123]
      },
      {
          id: 22,
          first: 'Student',
          last: 'Two',
          classes: [123, 789]
      },
      {
          id: 33,
          first: 'Student',
          last: 'Three',
          classes: [123]
      },
      {
          id: 44,
          first: 'Student',
          last: 'Four',
          classes: [123]
      },
      {
          id: 55,
          first: 'Student',
          last: 'Five',
          classes: [123]
      },
      {
          id: 66,
          first: 'Student',
          last: 'Six',
          classes: [456]
      },
      {
          id: 77,
          first: 'Student',
          last: 'Seven',
          classes: [456, 789]
      },
      {
          id: 88,
          first: 'Student',
          last: 'Eight',
          classes: [456]
      },
      {
          id: 99,
          first: 'Student',
          last: 'Nine',
          classes: [456]
      }
  ];
  </code></pre>
  
  <p>My controller looks like this:</p>
  
  <pre><code>var IndexController = Ember.ArrayController.extend({
      actions: {
          isActiveTog: function(id){
              console.log(this);
              console.log(this.store.get('model'));
  
              var getter = this.get('classgroup');
              console.log(getter);
          }
      },
      classCount: function(){
          return this.get('length');
      }.property('@each')
  });
  
  export default IndexController;
  </code></pre>
  
  <p>This is our router:</p>
  
  <pre><code>import Students from "appkit/models/students";
  import ClassGroup from "appkit/models/classgroup";
  
  export default Ember.Route.extend({
      model: function() {
          return this.store.find('classgroup');
      },
      setupController: function(controller, model){
          this._super(controller, model);
  
          controller.set('students', this.store.find('students'));
          controller.set('classgroup', this.store.find('classgroup'));
      }
  });
  </code></pre>
  
  <p>Here is the <code>each</code> block within our handlebars template (I removed the rest as it makes it too bulky):</p>
  
  <pre><code>{{#each classgroup}}
              &lt;li id="c_{{unbound this.id}}" class="classMenu manageMenuWidth"&gt;
                  &lt;span class="classSA" id="c_{{unbound this.id}}_sas"&gt;&lt;input type="checkbox" name="c_{{unbound this.id}}_chk" id="c_{{unbound this.id}}_chk" /&gt;&lt;/span&gt;
                  &lt;span id="c_{{unbound this.id}}_nam" {{bind-attr class=":classLayout isActive:activeSelection"}} {{action "isActiveTog" this.id on="click"}}&gt;{{unbound this.className}}&lt;/span&gt;
                  {{#view 'toggleclass'}}&lt;span class="togControl" id="c_{{unbound this.id}}_tog"&gt;&lt;/span&gt;{{/view}}
              &lt;/li&gt;
              &lt;ul id="c_{{unbound this.id}}_sts" class="students manageMenuWidth"&gt;
                  {{#each students}}
                      &lt;li class="student" id="s_{{unbound this.id}}_c_{{unbound classgroup.id}}"&gt;
                          &lt;span class="studentChk" id="s_{{unbound students.id}}_c_{{unbound classgroup.id}}_img"&gt;{{unbound this.last}}, {{unbound this.first}}&lt;/span&gt;
                          &lt;input type="checkbox" name="s_{{unbound students.id}}_c_{{unbound classgroup.id}}_chk" id="s_{{unbound students.id}}_c_{{unbound classgroup.id}}_chk" /&gt;
                      &lt;/li&gt;
                  {{/each}}
  </code></pre>
  
  <p>I included as much of our code as possible because I'm still very new to Ember and I want to make sure that you have all the information you need to help answer this question, even if it means giving you too much.</p>
  
  <p>So that you aren't digging too much, here is some more information. In the handlebars template there is a line <strong>{{action "isActiveTog" this.id on="click"}}</strong> within our span.</p>
  
  <p>This will call a function in our controller, <code>isActiveTog</code>, which we would like to use to toggle the value of <code>isActive</code> in the model for whichever "classgroup" record was clicked in the <code>each</code> loop.</p>
  
  <p>For example, the user clicks on "Class 1", which has an action call to <code>isActiveTog</code>, passing in ID = 123. I want my action in the controller to toggle value of ClassGroup[123][isActive] from 0 to 1, or vice versa.</p>
  
  <p>I can say that my controller is being called correctly, because I am able to put <code>{{classCount}}</code> in my template and see a "3" in the output. Thus, the problem is that I am unable to figure out a way to toggle the value in the controller.</p>
  
  <p>How can I use <code>this.store.find()</code> to search for a <code>classgroup</code> row with an ID equal to whatever was passed to the action, and then access the isActive value of that class record. Then I need to use <code>this.store.set()</code> to write back to model.</p>