Emberjs - Create 'Edit' action that edits a model without leaving '/models' url

Question

I need help creating an 'edit' action that selects a specific model from a list of models, and in that table, edits the model. A quick-edit of sorts.

  <tbody>
    {{#each}}
      <tr class="people-list">
        <td>
          <input type="checkbox" class="toggle">
          <label class="category-text">{{#linkTo 'category' this}}{{Name}}{{/linkTo}}    </label>
          <img class="table-img" src="images/x.png">
          <img class="table-img" {{action 'edit'}} src="images/pencil-grey.png">
        </td>
      </tr>
    {{/each}}
  </tbody>

By clicking {{action 'edit'}}, {{Name}} becomes and editable input. This is all done without leaving the '/categories' url.

Thanks guys :D

Answer 1

<tbody>
    {{#each}}
      <tr class="people-list">
        <td>
            <input type="checkbox" class="toggle">
            {{#if isEdit}}
            {{input type="text" valueBinding="Name" name="Name"}}
            {{else}}
            <label class="category-text">{{#linkTo 'category' this}}{{Name}}{{/linkTo}}</label>
            {{/if}}
            <img class="table-img" src="images/x.png">
            <img class="table-img" {{action 'edit'}} src="images/pencil-grey.png">
            </td>
        </tr>
    {{/each}}
</tbody>

And then on the controller:

actions: {
    edit:function(){
        this.set('isEdit', true);
    }
}