RelationalModel relation field at NULL after job's done

Question

I got a wtf problem that I can't figure out. I explain :

I have a model named Product :

var Product = Backbone.RelationalModel.extend(
{
    urlRoot: Backbone.rootApiUrl + '/products',
    defaults: {
        id: '',
        name: '',
        description: '',
        current_price: '',
        categories: '',
        duration: '',
        shipping_cost: '',
        start_date: '',
        user_id: null,
        is_buy_it_now: ''
    },

    relation: [{
        type: Backbone.HasOne,
        key: 'user_id',
        relatedModel: User,
        autoFetch: true
    }]
});

My field user_id is a foreign key for one User (which is also a Model in Backbone) :

var User = Backbone.RelationalModel.extend(
{
    urlRoot: Backbone.rootApiUrl + '/users',
    defaults: {
        id: '',
        name: '',
        email: '',
        firstname: '',
        lastname: '',
        password: '',
        card_nb: '',
        cart_total: ''
    }
});

My fetch relations work perfectly in each separate model. But when i put a relation between the Product.user_id and my User model, a wtf error occurs.

I've tried everything possible : all the keys (keySource, keyDestination ........... with all values possibles). I've even put breakpoints into the Relation Lib to be able to watch what happened ... Nothing to say. Even StackOverflow doesn't know this bug :P (Or i badly searched)

The final problem is :

• My product is correctly sent by the API and set in Backbone (OK).
• The field user_id is first set at a number by the Product API response, and then put at NULL by Relational instead of being replaced by the object User (WHY ?)
• When I watch my network debugger, Relational calls the API for the User object (it's all right here) with the user_id number (OK). The server response is good, with the right user in JSON (OK). But Relational doesn't bind this response object with the field user_id, which is now .... NULL (NOT OK).
  • So I got a User object lost (but I can console.log() it if I put a success function in my autoFetch), not correctly linked to his parent Product with the field user_id.

EDIT : a JSFiddle is available here http://jsfiddle.net/gjdass/WNWrm/ (Be careful, the API can be long to respond, about 10sec, it's normal).

Thanks in advance :/ Sorry for the time you may take for this.

Answer 1

Does it behave any differently if you remove the default value of user_id? I wonder if it's fetching the relation and then applying the default value of null.

You might also try setting Backbone.Relational.showWarnings to true if it isn't already, and check your console for any warnings.

Answer 2

Give this a shot:

    relations: [{
        type: Backbone.HasOne,
        key: 'id',
        keyDestination: 'user_id',
        includeInJSON: 'user_id',
        autoFetch: true,
        relatedModel: User
    }]

I couldn't make heads or tails of the backbone-relational documentation. Apparently key is supposed to reference the id of the related model, but it doesn't seem to do that in any of their examples. I wonder if their examples actually work? Anyway, I think this fixes your issue: setting key to the key from the related model and setting keyDestination and includeInJSON so it knows how to set and serialize the result into the product object.

Answer 3

So if you look at the backbone relational documentation closely, you'll notice none of the examples they give are HasOne with a reverseRelation of HasMany. As such, it seems that functionality is untested (except by you!) and non-functioning. Try the relationship the other way:

var User = Backbone.RelationalModel.extend(
{

    urlRoot: 'http://noraj.fr:5000/users',
    defaults: {
        id: '',
        name: '',
        email: '',
        firstname: '',
        lastname: '',
        password: '',
        card_nb: '',
        cart_total: ''
    },

    relations: [{
        type: Backbone.HasMany,
        key: 'products',
        relatedModel: 'Product',
        reverseRelation: {
            key: 'id',
            keySource: 'user_id',
            keyDestination: 'user_id',
            includeInJSON: true
        }            
    }]            
});
// Product Model
var Product = Backbone.RelationalModel.extend(
{

    urlRoot: 'http://noraj.fr:5000/products',
    defaults: {
        id: '',
        name: '',
        description: '',
        current_price: '',
        categories: '',
        duration: '',
        shipping_cost: '',
        start_date: '',
        is_buy_it_now: '',
        user_id: null
    }        
});