DarkLeafyGreen
DarkLeafyGreen

Reputation: 70426

Backbone.js prints "function String() { [native code] }" instead of model attribute

I am new to backbone.js and here is my question.

First I setup routing:

var Router = Backbone.Router.extend({

    initialize: function(){

      var data = {
        member: new Member.Model({ _id: 'some id' })
      };

      _.extend(this, data);
      // Use main layout and set Views.
      app.useLayout("main-layout").setViews({
        ".member": new Member.Views.Start(data)
      }).render();
    },
    routes: {
      "": "index"
    },
    index: function() {
      this.member.fetch();
    }
});

On index route this will simply get the start view and add it to the DOM when an element matches the member class. This works just fine. However inside the template I have:

<%= model.get('username') %>

And this prints

function String() { [native code] }

instead of the model attribute. Here is the model and view class:

var Member = app.module();

Member.Model = Backbone.Model.extend({
    urlRoot: '/Members',
    idAttribute: "_id",
    defaults: {
      _id: null,
      name: String,
      email: String,
      username: String,
      initials: String,
      provider: String,
      provider_id: String,
      confirmed: Boolean,
      provider_avatar: String
    },
    initialize: function(models, options){

    }
  });

Member.Views.Start = Backbone.View.extend({
    template: "member/start",
    serialize: function() {
      return { model: this.options.member };
    },        
    initialize: function() {

    }
  });

For my project I use the backbone boilerplate https://github.com/backbone-boilerplate/backbone-boilerplate Template enging : https://github.com/backbone-boilerplate/backbone-boilerplate/wiki/Working-with-templates

Why do I get this text instead of the model values, and how to fix this?

Upvotes: 0

Views: 7284

Answers (2)

Andrew
Andrew

Reputation: 13853

In your Model definition you define all your defaults as functions, one way to fix it is to use actual strings for the defaults,

defaults: {
  _id: null,
  name: '',
  email: '',
  username: '',
  initials: '',
  provider: '',
  provider_id: '',
  confirmed: false,
  provider_avatar: ''
},

If you type String into your browsers console you will get,

 function String() { [native code] }

That is why your output is how it is.

Upvotes: 1

NPE
NPE

Reputation: 500703

The default value of the username attribute is String:

Member.Model = Backbone.Model.extend({
    ...
    defaults: {
      ...
      username: String,
      ...

and String is a function:

> String
function String() { [native code] }

This is what you're seeing (remember, in Javascript you can assign functions to variables).

If you expect the default to be some value of type string, you need to change the code like so:

Member.Model = Backbone.Model.extend({
    ...
    defaults: {
      ...
      username: '',
      ...

Upvotes: 3

Related Questions