Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

can't use el: 'body' in View #1

Closed
e6nian opened this Issue · 5 comments

2 participants

Sean Yu Kelly Miyashiro
Sean Yu

$ is not defined there.
el: $('body') is ok

Kelly Miyashiro
Owner

Can you elaborate on this? Backbone should correctly assign $ for its selector functions as long as jQuery is defined on window. The example code assumes you are assigning the vars in the global namespace.

I just tried out a simple example and it seems to work for me:

Server Side Express

app.configure(function(){
  app.set('views', __dirname + '/views');
  app.set('view engine', 'jade');
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
  app.use(browserify({
    require : { jQuery: 'jquery-browserify', backbone: 'backbone-browserify' }
  }));
  app.use(express.static(__dirname + '/public'));
});

Client Side in HEAD

var $ = jQuery = require('jQuery'),
    Backbone = require('backbone');

var myView = Backbone.View.extend({
        el: 'body',
        initialize: function() {
            this.render();
        },
        render: function() {
            $(this.el).html('<h1>oh hi</h1>');
        }
})

$(document).ready(function() {
    var myViewInstance = new myView();
});
Kelly Miyashiro
Owner

Wait... are you actually using this package or the original Backbone package? The "$ is not defined" problem is the whole point of this browserify specific package. Make sure you read the updated README for more example code.

npm install backbone-browserify, not npm install backbone.

Sean Yu

I've used npm install backbone-browserify

$ = window.jQuery = require 'jquery-browserify', then everything is OK
but $ = jQuery = require 'jquery-browserify' . then not work :|

Kelly Miyashiro
Owner

I see, are you defining those variables in a closure other than window, for example... in another file that is included by browserify? That's what it sounds like. both jquery-browserify and backbone-browserify were meant to be used in the context of window.

In that case you must also define window.$ = window.jQuery = require('jquery-browserify'). This is just how browserify works, it does not pass window as this to the included modules, which is the whole reason I had to make this special package for Backbone. Sounds like everything is working "as expected", which is actually a big problem with Browserify IMO.

Kelly Miyashiro
Owner

I'm about to commit a change where it will always pass this to Backbone, whether this is window or another context is up to you, depending on where you define backbone, ie

function myContext() {
    var Backbone = require('backbone-browserify');
}

... will pass the function myContext as this to Backbone. This should mean that you don't have to specify window.jQuery = when you define jQuery in the same context as Backbone.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.