Trunk View Uncaught Link Error

Question

I would appreciate help in understanding why I am receiving (see code below). In fact, when initializing the view, I get a model and inside the rendering method, which I pass "this.model" - the model of the instance - for the template. In all other representations, even if the instance model is undefined INCORRECT FAULT IS IMPOSSIBLE. Does anyone know why he is thrown here?

Views.Projects.EditView = Backbone.View.extend({ tagName: 'div', id: 'edit-project-content', template: JST['projects/edit'], initialize: function(){ this.model = new Models.Project({id: this.options.projectId}); this.model.bind('change', this.render, this); this.model.fetch({ error: function(model, response) { alert('Error...Please try again.'); } }); }, render: function() { $(this.el).html(this.template({project: this.model})); // Error references this line. return this; } }); 

Template:

 <% if (typeof project != 'undefined') { %> <div id="edit-details"> <form id="edit-project-form"> <ul> <li> <p class='form-title'>Edit Project: "<%= project.get('title') %>"</p> </li> <li> <label for='project-title'>Project Title:</label> <input id='project-title' type='text' value="<%= project.get('title') %>" /> </li> <li> <label for='due-date'>Due Date:</label> <input id='due-date' type='text'></input> </li> <li> <label for='project-description'>Description:</label> <textarea id='project-description'><%= project.get('description') %></textarea> </li> <li> <input id='submit-project-edits' type='submit' value='Edit' /> </li> </ul> </form> </div> <% } %> 

Thanks.

Answer 1

Try the following:

 render: function() { model = this.model; $(this.el).html(this.template({project: model})); // Error references this line. return this; } 

Answer 2

You can change

 <% if (typeof project != 'undefined') { %> 

to

 <% if( project != null ) { %> 

or

 <% if( project ) { %> 

See https://developer.mozilla.org/en/JavaScript/Reference/Operators/typeof

 typeof undefined === 'undefined' typeof null === 'object' 

Attempting to access the null or undefined property will throw an exception in JS. (I sometimes skip ActionScript 2 :)

Answer 3

I have replicated your code, and when I debug it in the console, I get the following error.

Uncaught TypeError: Object # does not have a 'get' method

I saw the "project" model in the console and binds the model to a template. It could be a twist on your side if you can repeat it.

I had the same problem in my application and this is what I did and it worked. I needed to specify the type of model in the view, and it worked. Try it and see if it helps. Hope it helps.

 Views.Projects.EditView = Backbone.View.extend({ tagName: 'div', **model : your model** id: 'edit-project-content', template: JST['projects/edit'], initialize: function(){ this.model = new Models.Project({id: this.options.projectId}); this.model.bind('change', this.render, this); this.model.fetch({ error: function(model, response) { alert('Error...Please try again.'); } }); }, render: function() { $(this.el).html(this.template({project: this.model})); // Error references this line. return this; } });