Ember data createRecord not working: “TypeError: undefined is not a function”

Question

I'm using Ember data for a web app and everything has been working pretty smoothly until I tried saving some new data using "createRecord".

This is the gist of the code:

App.Store = DS.Store.extend({
  adapter: DS.RESTAdapter.create({
    namespace: 'api'
  })
});

App.Training = DS.Model.extend({
  dateTimestamp: DS.attr('number'),
  dateTime: DS.attr('string'),
  dateDay: DS.attr('number'),
  dateWeekday: DS.attr('string'),
  dateMonth: DS.attr('string'),
  teacherId: DS.attr('number'),
  teacherFirstName: DS.attr('string'),
  teacherPhoneNumber: DS.attr('string'),
  teacherAvatarCss: DS.attr('string'),
  spotName: DS.attr('string'),
  spotNamespace: DS.attr('string'),
  spotId: DS.attr('number'),
  spotHasPicture: DS.attr('string'),
  spotPictureCss: DS.attr('string'),
  spotUrl: DS.attr('string')
});

I've built a simple REST api for the backend, and fetching data works great:

App.KalenderRoute = Em.Route.extend({
  model: function() {
    return this.store.find('training'); // This works!
  }
});

I then try to call an action in my Controller to save a new record:

App.KalenderController = Em.ArrayController.extend({
  actions: {
    addTraining: function(){
        var store = this.store;
        store.createRecord('training', {
            spotId: 5
        }); // This does not work :(
    }
  }
});

If I've understood correctly, this should send a POST AJAX request to /api/training with the spotId parameter. However, the POST request is never sent it seems, and instead my console says:

TypeError: undefined is not a function 

Full stack trace:

DS.Store.Ember.Object.extend.createRecord ember-data.prod.js:1575
App.KalenderController.Em.ArrayController.extend.actions.addTraining App.js:197
Mixin.create.send ember.prod.js:15207
runRegisteredAction ember.prod.js:34269
Backburner.run ember.prod.js:7947
apply ember.prod.js:7779
run ember.prod.js:6415
handleRegisteredAction ember.prod.js:34267
(anonymous function) ember.prod.js:22582
m.event.dispatch jquery.min.js:3
r.handle

Is there anyone who has any idea why this is? It's driving me crazy!

Answer 1

The store doesn't need to be defined since 1.0beta+ of Ember Data. You just define adapters and serializers.

App.ApplicationAdapter= DS.RESTAdapter.extend({
  namespace: 'api'
});

App.Training = DS.Model.extend({
  dateTimestamp: DS.attr('number'),
  dateTime: DS.attr('string'),
  dateDay: DS.attr('number'),
  dateWeekday: DS.attr('string'),
  dateMonth: DS.attr('string'),
  teacherId: DS.attr('number'),
  teacherFirstName: DS.attr('string'),
  teacherPhoneNumber: DS.attr('string'),
  teacherAvatarCss: DS.attr('string'),
  spotName: DS.attr('string'),
  spotNamespace: DS.attr('string'),
  spotId: DS.attr('number'),
  spotHasPicture: DS.attr('string'),
  spotPictureCss: DS.attr('string'),
  spotUrl: DS.attr('string')
});

Additionally no ajax call is made until you call save on the record

var record = this.store.createRecord('training',{
  spotId:1
});
record.save();

Example (with delay for fun): http://emberjs.jsbin.com/OxIDiVU/856/edit