2013-04-27 3 views
2

У меня есть сайт, разработанный с позвоночником. Я создал приложение и внутри него создаю некоторый subview.Подвижные события Backbone

В этом подвью я могу иметь div (с id close), и если я нажму на него, я должен вызвать событие. Но событие не срабатывает, я не знаю, почему. Можете ли вы объяснить мне, что я не так с этим событием?

Проблема в Search.Views.Product, подсмотр с событием.

Это мое приложение (я вырезать что-то, чтобы хорошо читать приложение):

//main app 
Search.Views.App = Backbone.View.extend({ 
    initialize:function() { 
     var this_app = this; 
     this.subView = { 
      Product : new Search.Views.Product({ 
       base_url:this_app.base_url || '', 
       collection : new Search.Collections.Products() 
      }) 
     } 
    }, 
    render:function (options) { 
     var defaults = { 
      products:{ 
       wrap:"ul", 
       id:"product-results", 
       class:"" 
      } 
     } 
     var settings = $.extend(true, defaults, options); 
     this.renderProducts(settings); 
    }, 
    renderProducts:function (settings) { 
      $(this.id).html(this.wrap(this.subView.Product.getTemplate(settings.products.view), settings.products)); 
    } 
}); 

//collection 
Search.Collections.Products = Backbone.Collection.extend({ 
    model: Search.Models.Product, 
    initialize:function() { 

    } 
}); 

Search.Models.Product = Backbone.Model.extend({ 
    defaults: search.product.defaults || {}, 
    initialize:function() { 

    } 
}); 

Search.Views.Product = Backbone.View.extend({ 
    //doesn't fire this event!!!-------------------------------------- 
    events: { 
     'click #close': 'closeResults', 
     'click': 'closeResults' 
    }, 
    closeResults:function (event) { 
     console.log('Close results'); 
     $('#close').html('test'); 
    }, 

    getTemplate:function (view) { 
     var data = this.collection.toJSON() || this.model.toJSON(); 

     data = this.normalize(data); 
     var template = Handlebars.compile($(this.template).html()); 
     return template({view:view, results:data}); 
    }, 
    render:function() { 
     // non utilizzato per ora 
     return this; 
    } 
}); 

ответ

2

Попробуйте передать элемент родительского представления в подвью. Изменение этого

 Product : new Search.Views.Product({ 
      base_url:this_app.base_url || '', 
      collection : new Search.Collections.Products() 
     }) 

в

 Product : new Search.Views.Product({ 
      el: this.$('.some-selector'), 
      base_url:this_app.base_url || '', 
      collection : new Search.Collections.Products() 
     }) 

И в вашем подвид заменить HTML этого. $ Эш с содержанием оказанной шаблона.

1

Выпуск № 1

потребность удостоверения личности, чтобы быть уникальным.

Используйте класс вместо этого. Измените #close на .close в своих разметках и привязках событий.

Выпуск № 2

Вы не ставим точку $ эш в рендеринге. Представление «Магистраль» передает всю свою внутреннюю селекторную работу своему собственному элементу.

От источника магистралей

$: function(selector) { 
    return this.$el.find(selector); 
}, 

Вам нужно позвонить и оказать ему необходимо установить эш для привязки событий к работе.

this.$el.html(...); 
+0

Не работает, я пробовал с классом до –

+0

Хорошо. Обладает ли более общий «щелчок» обязательным огнем? –

+0

Нет, он не срабатывает –