骨干+绑定

时间:2012-08-22 09:41:55

标签: json backbone.js

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');
}

如何将hiii警报输出的更改与按下该按钮的人员的详细信息绑定...

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

这是我得到的json ....当我点击按钮(有约翰名字)时,它应该显示它的消息....

2 个答案:

答案 0 :(得分:1)

如果我理解了你的问题,你可以做一些像......

var _self = this, 
    obj = Object;

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

答案 1 :(得分:1)

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

}