2013-02-25 167 views
0

我開發一個應用,在那裏我有這使得在一個循環子項目意見骨幹集合視圖:骨幹點擊觸發所有它的事件

# Collection view: 

class Newgvbtool.Views.ProductTypesIndex extends Backbone.View 

    template: JST['product_types/index'] 

    tagName: 'section' 

    events: -> 
    'click .new-item': @newItem 

    initialize: (options)-> 
    @company_id = options.company_id 

    Newgvbtool.vent.on 'product_types_index:add:model', @addToCollection 
    Newgvbtool.vent.on 'product_types_index:edit:model', @editModel 
    @collection.on 'reset', @render 
    @collection.on 'add', @appendItem 

    render: => 
    $(@el).html @template() 
    @collection.each @appendItem 

    @ 

    newItem: (e) => 
    e.preventDefault() 
    @showForm null 

    showForm: (model) => 
    if @editView? then @editView.remove() 

    @editView = new Newgvbtool.Views.ProductTypeEdit model: model, company_id: @company_id 

    $(@editView.render().el).dialog( 
     show: 
     title: 'Product type' 
     effect: 'drop' 
     direction: "up" 
     hide: "fade" 
     autoOpen: true 
     modal: true 
     draggable: false 
     minWidth: 400 
     height: "auto" 
     resizable: false 
    ) 

    appendItem: (model)=> 
    view = new Newgvbtool.Views.ProductType model: model 
    $('tbody').append(view.render().el) unless $('#product-types tbody').find("tr[data-id=#{model.id}]").length 

    addToCollection: (model) => 
    @collection.update model 
    model.trigger('highlight') 
    $(@editView.el).dialog 'close' 

    editModel: (model) => 
    @showForm model 

# Item view 

class Newgvbtool.Views.ProductType extends Backbone.View 

    template: JST['product_types/product_type'] 
    tagName: 'tr' 

    events: 
    'click .delete-item': 'deleteItem' 
    'click .edit-item': 'editItem' 

    initialize: (options)-> 
    @model.on 'highlight', @highlight 
    @model.on 'change', @render 

    render: => 
    $(@el).attr('data-id', @model.get('id')).html @template(model: @model) 
    @ 

    highlight: => 
    @$('td').effect 'highlight', 1000 

    deleteItem: => 
    if confirm "Are you sure?" 
     @model.destroy wait: true 
     $(@el).remove() 

    editItem: => 
    Newgvbtool.vent.trigger "product_types_index:edit:model", @model 

這是我用它來呈現每個項目模板:

%td 
    = @model.get 'name' 
%td 
    = @model.get 'description' 
%td.opts 
    %a.edit-item{ href: '#' } 
    %span.icon-edit 
    %a.delete-item{ href: '#' } 
    %span.icon-remove-sign 

事情是,每次點擊一個項目時,觸發編輯和刪除項目事件。

我在做什麼錯?

在此先感謝!

+0

你能分享你的'product_type'模板嗎? – neebz 2013-02-25 11:49:27

+0

@nEEbz當然!我已經編輯它來添加模板 – bigardone 2013-02-25 12:01:19

回答

1

錯誤是我將項目視圖添加到集合視圖的方式。

我在做這樣說:

$('tbody').append(view.render().el) 

而且沒有得到正確的事件代表團的參考,所以II剛剛添加的@(或本),現在它的工作原理就像一個魅力

@$('tbody').append(view.render().el)