CODEWITHSUNDEEP
ember.jsmodel
Michael
Michael

Reputation: 1622

Ember Model is never fetching belongs_to relationship, likely due to PK, but others work

Ember is returning data for other relationships, so not sure why this isn't working.

user_model.js

Models.User = DS.Model.extend({
  email: DS.attr("string"),
  firstName: DS.attr("string"),
  lastName: DS.attr("string"),
  ncesHighSchoolId: DS.attr('number'), //should map to #ncesHighSchool.schid

  role: DS.belongsTo("role"),
  zipcode: DS.belongsTo("zipcode"),
  ncesHighSchool: DS.belongsTo("ncesHighSchool"),    

  formattedSchool: function(){
    var schoolId = this.get('ncesHighSchoolId');
    if(schoolId){
      var school = this.store.find('ncesHighSchool', schoolId);
      var schoolLabel = null;
      if(schoolLabel){
        schoolLabel = school.name + ' - ' + school.city + ', ' + school.state;
      }
      return schoolLabel;
    }
  }.property('ncesHighSchoolId')
});

nces_high_school_model.js

Models.NcesHighSchool = DS.Model.extend({
  schid: DS.attr("number"), //this is the primary key, not a normal id field, can't use id field
  name: DS.attr("string"),
  city: DS.attr("string"),
  state: DS.attr("string"),

  users: DS.hasMany("user")
});

In my handlebars template: {{role}} and {{zipcode}} both return valid objects, i.e. <VdConsumer.Role:ember636:3> {{ncesHighSchoolId}} returns nothing, but if I take out ncesHighSchool from user_model.js it returns correctly. Having just the ncesHighSchool belongsTo relationship and not highSchoolId property, nothing works. {{formattedSchool}} returns nothing (sometimes in fiddling I have gotten it to return the function text itself

I need to have direct access to the ncesHighSchoolId property for a typeahead, but cannot figure out why the belongsTo isn't working for the ncesHighSchool object.

I suspect the non-trivial usage of schid as the primary key, but not sure how to fix, since this.store.find('ncesHighSchool', this.get('ncesHighSchoolId')); does get the object correctly, but feels hackish the way I'm doing it in formattedSchool

Ember Console chrome extension showing empty hash for highSchoolObject

Upvotes: 0

Views: 404

Answers (2)

Michael
Michael

Reputation: 1622

Everything with my entire architecture was fine, but I overly relied on Rails-esque abilities of needing ncesHighSchoolId as a separate attribute in my user model. Ember did not like having both ncesHighSchoolId: DS.attr('number') and ncesHighSchool: DS.belongsTo("ncesHighSchool", {async: true }) in the model. In order to get my typeahead to work, I had to cowboy up and do some extra processing. Important parts included for future readers.

edit.hbs

{{input type="text" placeholder="School Name" value=ncesHighSchool.schnam}}

user_edit_view.js

App.UserEditView = Ember.View.extend({
  afterRenderEvent: function(){
    var ctrl = this.controller;
     ......
    function(event, school){
       if(school && school.id){
         ctrl.store.find('ncesHighSchool', school.id).then(function(ncesHighSchool){
           ctrl.set('ncesHighSchool', ncesHighSchool);
         });
       }
    });

Upvotes: 0

Steve H.
Steve H.

Reputation: 6947

Unless your related model objects are side-loaded, you should include the async: true property:

role: DS.belongsTo("role", {async: true}),
zipcode: DS.belongsTo("zipcode" {async: true}),
ncesHighSchool: DS.belongsTo("ncesHighSchool" {async: true}),

Upvotes: 1

Related Questions