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この例でデータIDが必要な理由がわかりません。ビューをレンダリングするには、コレクションがバインドされているか、モデルがあるかの2つの方法があります。コレクションをビューにバインドする場合、コレクション内の適切なモデルを見つけるために、クリックされた要素から正しい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 に答える