CODEWITHSUNDEEP
javascriptember.jsember-data
Edy Bourne
Edy Bourne

Reputation: 6187

Ember Data not serializing record id on save(), resulting in PUT with no id?

I have a route that creates a new record like so:

App.ServicesNewRoute = Ember.Route.extend({
    model : function() {
        return this.store.createRecord('service');
    },

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

});

Then I bind that model's properties to the route's template using {{input type="text" value=model.serviceId ... }} which works great, the model gets populated as I fill up the form.

Then I save record:

App.ServicesNewController = Ember.ObjectController.extend({
    actions : {
        saveService : function() {
            this.get('model').save(); // => POST to '/services'
        }
    }
});

Which works too.

Then I click the save button again, now the save method does a PUT as expected since the model has an id set (id: 102):

enter image description here

But then when I look at the PUT request in Dev Tools, I see that the id attribute was not serialized:

enter image description here

As a result, a new instance is created in the backend instead of updating the existing one.

Please ignore the serviceId property, it is just a regular string property unrelated to the record id which should be named just id.

I don't know why the id is not being serialized... I cannot define an id property on the model of course since Ember Data will not allow it, it is implicit. So I don't know what I am missing...

Any help is greatly appreciated!

Upvotes: 3

Views: 5762

Answers (3)

brafdlog
brafdlog

Reputation: 2692

Initially I used ronco's answer and it worked well. But when I looked at ember data's source code I noticed that this option is supported natively. You just need to pass the includeId option to the serializer. Example code:

App.ApplicationSerializer = DS.RESTSerializer.extend({
    serialize: function(record, options) {
        options = options ? options : {}; // handle the case where options is undefined
        options.includeId = true;
        return this._super.apply(this, [record, options]); // Call the parent serializer
    }
});

This will also handle custom primary key definitions nicely.

Upvotes: 4

ronco
ronco

Reputation: 96

The base JSONSerializer in Ember-Data only includes id in the payload when creating records. See DS.JSONAdapter.serialize docs.

The URL the RestAdapter generates for PUTting the update includes the ID in the path. In your case I believe it would be: PUT '/services/102'.

You can either extract it from the path in your backend service. Or you should be able to override the behavior of your serializer to add the id like this:

App.ServiceSerializer = DS.JSONSerializer.extend({
  serialize: function(record, options) {
    var json = this._super.apply(this, arguments); // Get default serialization

    json.id = record.id;  // tack on the id

    return json;
  }
});

There's plenty of additional info on serialization customization in the docs.

Hope that helps!

Upvotes: 8

Blackening
Blackening

Reputation: 94

Well, as far as I know it's a sync issue. After first request you do the post request and then, it has been saved in the server, when you click next time the store haven't got enough time to refresh itself. I've got similar issue when I've created something and immediately after that (without any transition or actions) I've tried to delete it - the error appears, in your case there's a little bit another story but with the same source. I think the solution is to refresh state after promise resolving.

Upvotes: 0

Related Questions