Update belongsTo relation from dropdown (ember select view)?

Already tried to ask on stackoverflow but since this place is filled with smart ember people I might have a better chance to get an answer…

I have two models created like so:

// models/event-type.js
import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    category: DS.belongsTo('category', {async: true}),
    events: DS.hasMany('event', {async: true})
});

// models/category.js
import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    event_types: DS.hasMany('eventType')
});

The select field in the template is created as

 // templates/event-type.hbs
{{view "select"
    content=categories
    optionValuePath="content.id"
    optionLabelPath="content.title"
    selection=category.content
    class="form-control"}}

When I change the value and hit my save button to save the eventType model, the assigned category stays the same - thus gets not updated. I can’t find any hint in the documentation on how to deal with this, so I tried several things like observe the category in the eventType controller or try to get the category in my custom serializer but did not succeed (it seems the eventType model is never updated). I can’t imagine, that this is such an unusual use case so I’m wondering why I cant find anything related to this on the docu or the rest of the internet … (perhaps I don’t search smart enough… who knows)

1 Like

Unfortunately I’m not one of those smart people, who could help you, but I suggest to you to make a JsBin to demonstrate your problem.

Here is a small jsbin example …

I’m doing this with ember-cli and a restadapter…

I’m also interested on how to solve this problem with a similar setup. I save my User model with a location belongsTo attribute, but location is never updated with the new value.

Check the links below. It help me get the select working.

How do i set a value on an associated belongsto record

Ember-data assertion failed

Okay, thanx, will check those links.

Ember.Select is not compatible with ember-data relations or other async data.

In ember data, related records are stored in a ManyArray which proxies the array and does some ED magic. When you declare aysnc: true, the ManyArray is again wrapped in a PromiseProxy. The select view doesn’t seem to play nice with PromiseProxies.

I’m currently working on other solution for setting models relations. There is some basic prototype which I’m currently testing in one of my apps but it still has some issues. Any ideas / PR or contributions are welcome. GitHub - turboMaCk/ember-select-combo: Pure ember replacement of chosen or select2. It’s really early prototype I have to write pretty fast since I need at least some solution.