I'm trying to update my model with ember-data like this (jsBin):
App = Ember.Application.create({
ready: function() {
var post = App.Post.find(1);
post.one('didLoad', function() {
post.set('name', 'my new name');
post.save();
});
}
});
App.Store = DS.Store.extend({
revision: 12,
adapter: DS.FixtureAdapter
});
App.Post = DS.Model.extend({
name: DS.attr('string')
});
App.Post.FIXTURES = [
{id: '1', name: 'first post'}
];
and I get the following error in Chrome:
Uncaught Error: Attempted to handle event `didCommit` on <App.Post:ember226:1> while in state rootState.loaded.updated.uncommitted. Called with undefined
Is there something wrong or this is a bug ?
Related
Calculated field of model does not display while using RestAdapter. Why?
My route and view look like this:
App.MyObjRoute = Ember.Route.extend({
model : function(params)
{
return App.MyObj.find(params.myobjId);
}
});
App.MyObjView = Ember.View.extend({});
I have a DS.Model:
App.MyObj = DS.Model.extend({
first: DS.attr( 'string' ),
last: DS.attr( 'string' ),
firstlast: function()
{
return this.get('first') + ' ' + this.get('last');
}.property('first', 'last')
})
And a fixture code:
App.Store = DS.Store.extend({
adapter: DS.FixtureAdapter.create()
});
App.MyObj.FIXTURES = [
{
id: 1,
first: 'Trek',
last: 'Bob'
}
];
that i display in a template like this:
<script type="text/x-handlebars" data-template-name="myTemplate">
{{firstlast}} {{first}} {{last}}
</script>
And this works pretty well. I get "Trek Bob Trek Bob" displayed.
But when i preserve the Model:
App.MyObj = DS.Model.extend({
first: DS.attr( 'string' ),
last: DS.attr( 'string' ),
firstlast: function()
{
return this.get('first') + ' ' + this.get('last');
}.property('first', 'last')
})
and replace fixture code with a RestAdapter like this:
App.Store = DS.Store.extend({
revision: 13,
adapter: DS.RESTAdapter.extend({url: "myApi"})
});
Only {{first}} and {{last}} is displayed, and {{firstlast}} isn't.
How to fix it?
Hey I'm having trouble dynamically loading fixture data into my emberjs models. How should I go about doing this? The addArtist function at the bottom will add one song correctly but I'm not sure how to adapt this to loading all of the songs into the data store correctly. Is there an easier way than adding each one individually?
App.Store = DS.Store.extend({
revision: 13,
adapter: 'DS.FixtureAdapter'
});
App.Artist = DS.Model.extend({
name: DS.attr('string'),
tracks: DS.hasMany('App.Tracks')
});
App.Tracks = DS.Model.extend({
videoid: DS.attr('string'),
title: DS.attr('string'),
duration: DS.attr('number')
});
App.Artist.FIXTURES = [];
App.Tracks.FIXTURES = [];
App.loadFixtures = function(){
$.getJSON('/artists', function(data){
$.each(data.artists, function(i,v){
App.Artist.createRecord(v);
});
});
$.getJSON('/tracks', function(data){
$.each(data.tracks, function(i,v){
App.Tracks.createRecord(v);
});
});
};
App.addArtist = function(){
var artist = App.Artist.createRecord({
id: 3,
name: 'Justin Martin'
});
var track = App.Tracks.createRecord({
id: 300,
title: 'Jungle Mix',
duration: 200
});
artist.get('tracks').pushObject(track);
};
Sample JSON Responses:
{"artists":[
{"id":1,"name":"The (International) Noise Conspiracy","track_ids":[1,2,3,4]},
{"id":2,"name":"0SM","track_ids":[5]},
{"id":3,"name":"2am","track_ids":[6,7,8]}
]}
{"tracks":[
{"id":1,"videoid":"FyjmCg_VMU0","title":"Smash It Up","duration":197},
{"id":2,"videoid":"jKXWm9yi4DY","title":"Only Lovers Left Alive","duration":162},
{"id":3,"videoid":"fwbleH55CCk","title":"Up For Sale","duration":211},
{"id":4,"videoid":"50JdKhIB1EQ","title":"A New Morning, Changing Weather","duration":270},
{"id":5,"videoid":"bd6ve0ydHVo","title":"The Landing feat. Alex G - Original Mix","duration":322},
{"id":6,"videoid":"RnwVtbMW4x4","title":"Anxious","duration":238},
{"id":7,"videoid":"Yo0zsqa06ZE","title":"I Did Wrong","duration":305},
{"id":8,"videoid":"_9ydBAgg130","title":"I Love You (feat. Baekchan & Joohee)","duration":219}
]}
Should I include the track_ids in the Artists response or do they get added when I call this method?
artist.get('tracks').pushObject(track);
When I save a User all current dirty Users are commited. What do I have to change that a save only commits the transaction for that specific User?
app.js
App = Ember.Application.create();
App.Store = DS.Store.extend({
revision: 12,
adapter: 'DS.FixtureAdapter'
})
App.Router.map(function() {
this.resource('users', function() {
this.resource('user', { path: ':user_id' })
})
});
App.UsersRoute = Ember.Route.extend({
model: function() {
return App.User.find();
}
});
App.UserController = Ember.ObjectController.extend({
startEditing: function() {
this.transaction = this.get('store').transaction();
this.transaction.add(this.get('content'));
},
save: function( user ) {
user.transaction.commit();
}
})
App.User = DS.Model.extend({
lastName: DS.attr('string')
})
App.User.FIXTURES = [{
id: 1,
lastName: "Clinton"
}, {
id: 2,
lastName: "Obama"
}]
My guess is that startEditing is never called, otherwise this would probably be ok.
The other option is that you save multiple times the record. Once a record is saved, it is moved back to the store's default transaction. Any subsequential call to save would actually commit the store's transaction.
I use the following code to reload a Switchboard every x milliseconds. Can I tell ember-data to reload the SwitchboardEntrys which are in a hasMany relation to Switchboard recursively?
app.js
App = Ember.Application.create({
ready: function() {
if (reload_interval != 0) {
var switchboard = App.Switchboard.find(switchboard_id);
setInterval(function() {
switchboard.reload();
}, reload_interval);
}
}
});
App.Store = DS.Store.extend({
revision: 12
});
DS.RESTAdapter.configure("plurals", {
switchboard_entry: "switchboard_entries"
});
App.Switchboard = DS.Model.extend({
switchboardEntrys: DS.hasMany('App.SwitchboardEntry'),
name: DS.attr('string')
});
App.SwitchboardEntry = DS.Model.extend({
switchboard: DS.belongsTo('App.Switchboard'),
name: DS.attr('string'),
path_to_user: DS.attr('string')
});
Using:
Ember commit a5d45f66e1 from Jan 3, 2013)
Ember-Data commit 508479dee7 from Jan 4, 2013
Similar to this question ('Unable to get hasMany association'), I am unable to access embedded hasMany records directly but can see them through the model's content attribute.
For JSON:
{
"ref_book_search":{
"query":"har",
"results":[
{
"publisher":{
"name":"Pangolin",
"created":"2012-09-10T18:38:27.259515",
"id":"3d2028e4fb91181e1a6e012313914f821",
"is_active":true,
"main_url":null,
"resource_uri":"/api/v1/ref_publisher/3d2028e4fb91181e1a6e012313914f821"
},
"genre":"romcom",
"id":"cc671f00fc2711e1e41612313914f821",
"resource_uri":"/api/v1/ref_book/cc671f00fc2711e1e41612313914f821",
"title":"Harry Placeholder and the Goblet of PBR"
},
{
"publisher":{
"name":"Hoof & Mouth",
"created":"2012-10-10T14:31:27.259515",
"id":"3d200e9afb9811e1a27417383914f821",
"is_active":true,
"main_url":null,
"resource_uri":"/api/v1/ref_publisher/3d200e9afb9811e1a27417383914f821"
},
"genre":"horror",
"id":"cc621f08fc2711e1b81612313914e821",
"resource_uri":"/api/v1/ref_book/cc621f08fc2711e1b81612313914e821",
"title":"Harvey Weinstein Holiday Cookbook"
}
]
}
}
And app.js (note the map statements, which were the solution suggested in the prior question):
var App = Ember.Application.create();
DS.RESTAdapter.configure("plurals", {"ref_book_search" : "ref_book_search"});
App.store = DS.Store.create({
revision: 11,
adapter: DS.RESTAdapter.create({
bulkCommits: false,
namespace: "api/v1"
})
});
DS.RESTAdapter.map('App.RefBookSearch', {
primaryKey: 'query'
});
App.store.adapter.serializer.map('App.RefBookSearch', {
results: {embeddded: 'load'}
});
App.store.adapter.serializer.map('App.RefBook', {
publisher: {embeddded: 'load'}
});
App.RefPublisher = DS.Model.extend({
name : DS.attr('string'),
created : DS.attr('date'),
isActive : DS.attr('boolean'),
mainUrl : DS.attr('string')
});
App.RefBook = DS.Model.extend({
publisher: DS.belongsTo('App.RefPublisher'),
title : DS.attr('string'),
genre : DS.attr('string')
});
App.RefBookSearch = DS.Model.extend({
query: DS.attr('string'),
results: DS.hasMany('App.RefBook')
});
App.Router.map(function(match) {
match('/').to('query'),
match('/query/:ref_book_search_id').to('query')
});
App.QueryController = Ember.Controller.extend({
bookSearch: null,
results: []
});
App.QueryRoute = Ember.Route.extend({
setupControllers: function(controller, refBookSearch) {
controller.set('bookSearch', refBookSearch)
controller.set('results', refBookSearch.get('results').content)
}
})
App.initialize();
Everything looks fine at first, just like other poster:
search = App.RefBookSearch.find('ha')
search.get('query')
// => "ha"
results = search.get('results')
results.get('firstObject') instanceof App.RefBook
// => true
But then:
results.forEach(function(result) { console.log(result.get('title')) })
// => TypeError: Cannot call method 'hasOwnProperty' of undefined
Accessing via content shows the data is there:
results.content.forEach(function(result) { console.log(result.title) })
// => Harry Placeholder and the Goblet of PBR
// => Harvey Weinstein Holiday Cookbook
Now if I try accessing directly again, I get a slightly different error:
results.forEach(function(result) { console.log(result.get('title')) })
// => undefined x 2
This may or may not be related to this bug filed a few days ago.
I feel like I've tried everything here; I hope I'm just missing something simple. Any pointers very much appreciated. Thanks.
This is what ultimately worked for me. There seems to be some order-of-operations sensitivity i.e., doing the configure and map before creating the store. Also note that adapter.map is a convenience function that performs the mapping on the serializer.
App.Adapter = DS.RESTAdapter.extend()
App.Adapter.configure("plurals", {
"ref_book_search" : "ref_book_search",
"ref_book" : "ref_book",
"ref_publisher" : "ref_publisher"
});
App.Adapter.configure('App.RefBookSearch', {
primaryKey: 'query'
});
App.Adapter.map('App.RefBookSearch', {
results: {'embedded': 'load'}
});
App.Adapter.map('App.RefBook', {
publisher: {'embedded': 'load'}
});
App.store = DS.Store.create({
revision: 11,
adapter: App.Adapter.create({
bulkCommits: false,
namespace: "api/v1"
})
});