Ember null URL creates duplicate record with same ID but but all fields undefined

Ember Data
1

I’m using ember-data in my application. When I create a new record and save it, everything seems to work fine- a POST request is sent and the JSON response includes the record and an ID. However, when I mouse over the newly created record displayed in the template, the URL, shows

projects/null/undefined

instead of

projects/{id}/{project_name}

When I look at the new record in the ember debugger, it has an assigned ID field, but the name of the record is < App.Project:ember9380:null >, instead of having its ID in the name.

Clicking on this newly created project then causes a duplicate record to appear in the store with the same ID as the new project, but all its fields are undefined. Refreshing the page removes this duplicate, and displays the new record and its URL correctly.

My project controller code looks like this:

 actions: {
    openNewProject: function() {
      this.set("newProject", this.store.createRecord("project"));
      return this.send("openModal", this, "partials/projects/_new_project", "Create a new Project");
    },
    closeModal: function() {
      if (this.get('newProject')) {
        this.get('newProject').rollback();
      }
      return true;
    },
    save: function() {
      var self;
      self = this;
      this.send('showHideStatusBar', 'Saving project ...', 'status-bar-in-progress');
      return this.get("newProject").save().then((function() {
        return self.send('showHideStatusBar', 'Project successfully created', 'status-bar-success');
      }), (function(error) {
        return self.send('showHideStatusBar', 'An error occured while saving the project', 'status-bar-error');
      }));
    }}

This is a similar problem as described in