Backbone view script error

Question

Why am I getting a script error in this?

Initially what I wanted to ask was about passing a custom variable during a view initialization, but I came down to this.

JSFiddle for this

var ddd = Backbone.View.extend({
  el: "#sd",
  initialize: function() {
    console.log("rrr");
  },
  render: function() {

  }
});


console.log("dd");
var t = new ddd();
console.log(t);

<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.1.7/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>

<div id="sd">
  <p id="eee">

  </p>
</div>

V.S.V · Accepted Answer · 2016-10-23 08:50:36Z

1

If you want to pass custom variables to your backbone view just do like this.

in your view initialize

initialize: function(options){
    this.err= options.err;
},

And when you are making new instance of your view, just pass your variables as arguments like this

making new View instance

var err = 'somthing';
var t = new ddd({err: err})

Fixed version

your code should look like this

<html>
<head> 
    <script   src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>
</head>
<body>
    <div id="sd">
        <p id="eee">

        </p>
    </div>
    <script>
        var PN = Backbone.View.extend({
            el: $('#sd'),
            initialize: function(options) {
                    this.eee = options.eee
            },
            render: function() {
                 console.log(this.eee);
                    return this;
            }
        });

        var v = new PN({eee: 'somthing'});
        v.render();
    </script>
</body>
</html>

edited Oct 23, 2016 at 8:50

answered Oct 23, 2016 at 5:24

V.S.V

3022 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Cory Danielson Over a year ago

As a best practice, I've found that referencing the variables as this.options.err is best. Once you re-assign it to this.err it becomes difficult to tell where the variable came from... especially as the code grows over time.

V.S.V Over a year ago

@Cory Denielson Yes it is the best way, but someone who dont know how to pass custome veribles to view initialization it will be hard to understand.

S.Dan Over a year ago

I get it. But why am I getting the script error in the run snippet?

V.S.V Over a year ago

@SachiDangalla can you provide jsfidll

V.S.V Over a year ago

@SachiDangalla first of all update underscore. And use my answer structure. Your html page must look like this.

Mahi · Accepted Answer · 2016-10-23 07:57:01Z

Since you are using 1.1.7 version of underscore.js which is older. Backbone 1.3.3 is using higher version of underscore.js. because backbone has a dependency to underscore.js . Hope this helps

var ddd = Backbone.View.extend({
  el: "#sd",
  initialize: function() {
    console.log("rrr");
  },
  render: function() {

  }
});


console.log("dd");
var t = new ddd();
console.log(t);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>

<div id="sd">
  <p id="eee">

  </p>
</div>

Collectives™ on Stack Overflow

Backbone view script error

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related