centaure's Profile

centaure on #325 Backbone on Rails Part 2 (pro) 2012-04-04 21:37:09

At 9:49, my response.responseText contained {"name":["can't be blank"]}
and not {"errors": {"name":["can't be blank"]}} (i.e. there was no "errors" key).

So when parsing the messages within entries/index.js.coffee#handleError method, I did

          coffee
        
errors=$.parseJSON(response.responseText)

instead of

          coffee
        
errors=$.parseJSON(response.responseText).errors

I have rails 3.1.2, and my web browser is Chrome 16.0.912.77.

centaure on #323 Backbone on Rails Part 1 (pro) 2012-04-04 11:46:11

A nice introduction done at a good pace. Content was pretty informative. Thanks Ryan!

centaure on #323 Backbone on Rails Part 1 (pro) 2012-04-04 10:09:10

Hey Alan,
You were correct. Originally I followed your instructions and added a "require tree ." in the last line. But for whatever reason, I left the original "require tree ." in the line above. So the problem was still there (and Stuart spotted that in his comment below).

Thanks a lot!

Sunil

centaure on #323 Backbone on Rails Part 1 (pro) 2012-04-04 10:04:10

Hey Stuart,
You are correct. Not sure how I missed that other "require tree ." above. Thanks a lot.

Sunil

centaure on #323 Backbone on Rails Part 1 (pro) 2012-04-03 20:22:08

I noticed that I get the same error trace even at 3:45. When I look at the html file being generated, I see that raffler.js is placed before backbone.js. So the raffler script is being loaded before backbone?

          html
        
<!DOCTYPE html>
<html>
<head>
  <title>Raffler</title>
  <link href="/assets/application.css?body=1" media="screen" rel="stylesheet" type="text/css" />
<link href="/assets/main.css?body=1" media="screen" rel="stylesheet" type="text/css" />
  <script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/collections/entries.js?body=1" type="text/javascript"></script>
<script src="/assets/models/entry.js?body=1" type="text/javascript"></script>
<script src="/assets/raffler.js?body=1" type="text/javascript"></script>
<script src="/assets/routers/entries.js?body=1" type="text/javascript"></script>
<script src="/assets/views/entries/index.js?body=1" type="text/javascript"></script>
<script src="/assets/underscore.js?body=1" type="text/javascript"></script>
<script src="/assets/backbone.js?body=1" type="text/javascript"></script>
<script src="/assets/entries/index.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>
  <meta content="authenticity_token" name="csrf-param" />
<meta content="D17d/z61caff+D96DLjvNyLEKTSuvazXlegAu+DZAGs=" name="csrf-token" />
</head>
<body>

<div id="controller">Loading...</div>

My application.js file is as follows

          js
        
// This is a manifest file that'll be compiled into including all the files listed below.
// Add new JavaScript/Coffee code in separate files in this directory and they'll automatically
// be included in the compiled file accessible from http://example.com/assets/application.js
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// the compiled file.
//
//= require jquery
//= require jquery_ujs
//= require_tree .
//= require underscore
//= require backbone
//
//= require .//raffler
//
//= require_tree ../templates/
//= require_tree .//models
//= require_tree .//collections
//= require_tree .//views
//= require_tree .//routers
//= require_tree .

Sunil

centaure on #323 Backbone on Rails Part 1 (pro) 2012-04-03 19:55:07

Hey Alan,
Thanks for the post. I added the line, but it is still giving the same error trace. I restarted the server and everything. I even started from fresh in another computer (running Ubuntu 11.04). Same problem (I tried both Chrome and Firefox browsers). I am following Ryan's instructions step by step.

Before I spend time digging deep into this, any other help/suggestions will be really appreciated.

Sunil

centaure on #323 Backbone on Rails Part 1 (pro) 2012-04-03 10:38:10

I don't get the "home page" alert dialogue at 5:35. Note that I did get the "Hello from Backbone" alert at 3:45.

Any help will really be appreciated. I am running rails 3.1.2 in Ubuntu 10.04.

Also note that I had to include the gem "therubyracer" to get the server running at the start (I was facing the issue similar to https://github.com/rails/rails/issues/2963)

Below are the relevant parts of the code and the error trace I get in the console.

app/assets/javascripts/routers/entries.js.coffee

          ruby
        
class Raffler.Routers.Entries extends Backbone.Router
  routes:
    '': 'index'

  index: ->
    alert "home page"

app/assets/javascripts/raffler.js.coffee

          ruby
        
window.Raffler =
  Models: {}
  Collections: {}
  Views: {}
  Routers: {}
  init: ->
           new Raffler.Routers.Entries()
           Backbone.history.start()

$(document).ready ->
  Raffler.init()

The error trace I get in the console is:

In entries.js(5): Uncaught ReferenceError: Raffler is not defined

          ruby
        
(function() {
  var __hasProp = Object.prototype.hasOwnProperty,
    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor; child.__super__ = parent.prototype; return child; };

  Raffler.Collections.Entries = (function(_super) {
entries.js:5Uncaught ReferenceError: Raffler is not defined

    __extends(Entries, _super);

    function Entries() {
      Entries.__super__.constructor.apply(this, arguments);
    }

    Entries.prototype.model = Raffler.Models.Entry;

    return Entries;

  })(Backbone.Collection);

}).call(this);

In entry.js(5): Uncaught ReferenceError: Raffler is not defined

          ruby
        
(function() {
  var __hasProp = Object.prototype.hasOwnProperty,
    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor; child.__super__ = parent.prototype; return child; };

  Raffler.Models.Entry = (function(_super) {
entry.js:5Uncaught ReferenceError: Raffler is not defined

    __extends(Entry, _super);

    function Entry() {
      Entry.__super__.constructor.apply(this, arguments);
    }

    return Entry;

  })(Backbone.Model);

}).call(this);

In entries.js(23): Uncaught ReferenceError: Backbone is not defined

          ruby
        
(function() {
  var __hasProp = Object.prototype.hasOwnProperty,
    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor; child.__super__ = parent.prototype; return child; };

  Raffler.Routers.Entries = (function(_super) {

    __extends(Entries, _super);

    function Entries() {
      Entries.__super__.constructor.apply(this, arguments);
    }

    Entries.prototype.routes = {
      '': 'index'
    };

    Entries.prototype.index = function() {
      return alert("home page");
    };

    return Entries;

  })(Backbone.Router);
entries.js:23Uncaught ReferenceError: Backbone is not defined

}).call(this);

In index.js(17): Uncaught ReferenceError: Backbone is not defined

          ruby
        
(function() {
  var __hasProp = Object.prototype.hasOwnProperty,
    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor; child.__super__ = parent.prototype; return child; };

  Raffler.Views.EntriesIndex = (function(_super) {

    __extends(EntriesIndex, _super);

    function EntriesIndex() {
      EntriesIndex.__super__.constructor.apply(this, arguments);
    }

    EntriesIndex.prototype.template = JST['entries/index'];

    return EntriesIndex;

  })(Backbone.View);
index.js:17Uncaught ReferenceError: Backbone is not defined

}).call(this);

In raffler.js(9): Uncaught TypeError: Undefined is not a function

          ruby
        
(function() {

  window.Raffler = {
    Models: {},
    Collections: {},
    Views: {},
    Routers: {},
    init: function() {
      new Raffler.Routers.Entries();
raffler.js:9Uncaught TypeError: undefined is not a function
      return Backbone.history.start();
    }
  };

  $(document).ready(function() {
    return Raffler.init();
  });

}).call(this);

Comments by