in ember, how to get a reference to a model in that controller for saving

Question

I'm evaluating Emberjs in the context of whether we could port some of our code to it but maintain the same api so my first day really looking at it.

I'm using the Tom Dale tutorial but WITHOUT ember-data. I think I have kinda figured out how to get data into the app (thx @kingping2k). I just need to get this to save / update.

I have a doneEditing action which gets called when I click on it as seen by console but how do I get a reference to the model. Looking at the controller docs ( http://emberjs.com/api/classes/Ember.Controller.html ), I don't see a really obvious property like model or something. How would I tell the PostController to save the post that it is getting back in its route? Also, do people normally use jQuery promises to do something else after the save has completed here(I'm assuming yes)?

I've included the relevant code with the doneEditing action at the bottom where I'm looking for help:

thx for any help

Model:
Hex.Post = Ember.Object.extend({
    id: null,
    body: null,
    isEnabled: null,
    createdAt: null,
    save: function(data){
      console.log("you want to save this item");
      $.post( "api/post", data, function( data ) {
         // something here
    });
    }
});

View:
<script type="text/x-handlebars" id="post">
  {{#if isEditing}}
  {{partial 'post/edit'}}
  <button {{action 'doneEditing'}}>Done</button>
  {{else}}
  <button {{action 'edit'}}>Edit</button>
  {{/if}}

  <h1>{{id}}</h1>
  {{outlet}}
</script>

Route:
Hex.PostRoute = Ember.Route.extend({
    model: function(params) {
        console.log('called with: ' + params.post_id);
       return Hex.Post.findById(params.post_id);
    }
});


Controller:
Hex.PostController = Ember.ObjectController.extend({
    isEditing: false,

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

    doneEditing: function() {
        this.set('isEditing', false);
        console.log("this gets called");
        //this.get('content').save();
        //this.save();
        //console.log("here: " + this.model.id);
        //this.model.save(); //doesn't work ???
        // this.post.save(); //doesn't work ???
        //this.get('store').commit(); // prob no
    }
   }
});

Answer 1

when you return a model from the model hook it's then passed to the setupController in the route. The default implementation of setupController does this, controller.set('model', model)

setupController:function(controller, model){
    controller.set('model', model');
}

so to get the model within the context of the controller just get that property.

var model = this.get('model')

I would return the promise, then you can trigger something on save/failure etc

save: function(){
  console.log("you want to save this item");
  return Ember.$.post( "api/post", JSON.stringify(this));
}

doneEditing: function() {
    this.set('isEditing', false);
    var model = this.get('model');
    model.save().then(function(){alert('saved');},
                      function(){alert('failure');});
}

And generally you'll put save in the reopen

Hex.Post.reopen({
  save: function(){
    console.log("you want to save this item");
    return Ember.$.post( "api/post", JSON.stringify(this));
  }
});