ghost...
ghost...

Reputation: 1001

backbone + binding

var ListView = Backbone.View.extend({
el: $('hello'),
events: {                           
      'click .myName':  'namefunc',
},   
initialize: function() {
    var stuff = new FieldCollection();
    stuff.parse();
    var self = this;
    stuff.fetch({
        success: function (collection, response) {
            console.log(response);
            self.render(response);
            return response;
        }
    });
},
render:function(output){
    _.each(output, function(i){
        p=i.name;
        $(this.el).append("<button class='myName'>"+p+"</button><h1>"+i.img+"</h1><br/>");
    },this);     

},
namefunc:function(){
    alert('hiii');
}

how to bind the change the hiii output of alert with the details of the person against whom the button is pressed...

{
    "name": "john",
    "img": "john.jpg",
    "loc": "delhi",
    "msg": "hello there"
}

this is the json which i m getting....when i click on button(having john name) it should show its msg....

Upvotes: 0

Views: 155

Answers (2)

ghost...
ghost...

Reputation: 1001

initialize: function() {
var self = this;
_.bindAll(this, 'render');
this.collection = new FieldCollection();
this.collection.parse();

this.collection.fetch({
    success: function (collection, response) {
        console.log(response);
        self.render();
    }
});

},

render:function(){
var self = this;
_.each(this.collection, function(model) {
    // here you should create subviews and delegate events within particular view
    // i.e:
    // self.buttonViews.push(new ButtonView({ model: model}));
    // but for now you can use data-id attribute to match the button you clicked
    $(self.el).append("<button class='myName' data-id=" + model.id + ">" + model.name + "</button><h1>" + model.img + "</h1><br/>");
});     

},

namefunc:function(){
//use data-id attribute we put in button tag earlier to catch the id
//and use this.collection.get('id') function to get the model you want to get parameters of

}

Upvotes: 1

ryan j
ryan j

Reputation: 310

If i've understood your question, you could just do something like...

var _self = this, 
    obj = Object;

$("<button>"+someVariable+"</button>")
    .addClass('myName')
    .appendTo(this.$el)
    .on({
        "click": function() { _self.fn(obj) }
    });

Upvotes: 1

Related Questions