5

如何知道我点击的项目的 ID?我的代码如下:

$(function() {
  ipl.mvc.view.openings_view = ipl.mvc.view.view_base.extend({
    template: '/assets/t/plmt/companies.tmpl.html',
    ID: '#tmpl_openings',
    events: {
      "click #edit": "editpost"
    },
    initialize: function() {
      var _this = this;
      _.bindAll(this, 'addOne', 'addAll', 'render', 'editpost');
      _this.loadTemplate(_this.template, function() {
        _this.model = new ipl.mvc.model.companies_model([]);
        _this.model.view = _this;
        _this.model.bind('change', _this.render, _this);

      });
    }

    ,
    render: function() {
      var _this = this
      jsonData = _this.model.toJSON();
      _.each(jsonData, function(model) {
        $(_this.ID).tmpl(model).appendTo(_this.el);
        return _this;
      });
    }
    ,
    editpost: function(e) {
      console.log("EDIT CLICKED");
      e.preventDefault();
      var ele = $(e.target);
      console.log(ele);
      _this.model = new ipl.mvc.collection.companies_collection([]);
      var id = _this.model.get("id");
      alert(id);
    }
  });
});

和模板

<a href="!/editpost/${id}" data-id="${id}"><button id="edit"  ><img   src="/assets/img/pencil.png" /></button></a>

我需要 id 才能在编辑功能中使用,但不是${id}从模板中获取,我按照这些步骤操作但我没有得到它?如何${id}从模板中获取点击的项目?

4

2 回答 2

13

实际上你需要的是:

  1. 您已在模板中的 html 元素上设置了 data-id

  2. 您添加了在正确事件上执行的方法(editPost)

  3. 在那个 editPost 方法中,你可以这样做:

    editPost: function(e){
      e.preventDefault();
      var id = $(e.currentTarget).data("id");
      var item = this.collection.get(id);
    }
    

备注我注意到你的代码有太多的结束标签,所以它不会在这里运行,我还注意到在你的editPost中你尝试了_this,但你从未声明_this。你应该有var _this = this;那种方法。

备注 2我不明白为什么在这个例子中你甚至需要一个 data-id,有两种渲染视图的方法,视图有一个绑定到它的集合,或者它有一个模型。将集合绑定到视图时,您可能需要以某种方式从单击的元素中获取正确的 id 以在集合中找到正确的模型

但是在您的示例中,您的视图绑定了一个模型,因此您只有那个 1 ID,您可以通过调用this.model.get('id');我相信您上面的整个代码示例从另一个示例中复制,其中他们在查看,因为您的渲染和 data-id 属性的使用都表明了这一点。

于 2012-03-05T09:32:50.633 回答
-1

这是另一种(较新版本的骨干?)这样做的方式:(我看到@Sandermodel.get在他的评论中展示了该方法)

var AppointmentView = Backbone.View.extend({
  events: {
    'click' : 'alertTitle'
  },

  alertTitle : function(e) {
    // this.model.get('id') is what you're looking for
    alert( this.model.get('title') );
  }
});
于 2014-07-01T07:40:56.693 回答