Получите идентификатор другого вида в Backbone

Question

У меня есть два вида, у одного из них есть окно поиска, которое включает в себя кнопку «Поиск» с id="search". Во втором представлении я хочу, чтобы при нажатии кнопки «Поиск» выполнялся поиск. Но для этого мне нужно получить идентификатор. Как это можно сделать?

Вот код моей второй точки зрения, но не работает, потому что #search находится в первой точки зрения:

ev.views.Home = Backbone.View.extend({ 
events: { 
     'click #search' : 'searchKey', 
}); 

Answer 1

Все события хэш ограничены мнением el. Следовательно, событие не будет инициировано. Доступ к элементу Глобально и привязка события с помощью jquery в инициализации view.

 ev.views.Home = Backbone.View.extend({ 
     initialize:function(){ 
     $('#search').click(this.searchKey); 
     } 

}); 

Редактировать: этот ответ решает проблему. считать Peter Wagener ответ.

Answer 2

В глобальном масштабе есть слушатель click, но приложение будет работать с трудом, поскольку оно растет. Вам лучше обрабатывать каждый View как прямоугольник на странице, который только знает о вещах, которые происходят внутри себя. Когда нужно взаимодействовать с двумя представлениями, вам нужен какой-то способ координации между ними.

Одно простое предложение использовать модель в качестве шины события между двумя видами:

var ViewWithSearch = Backbone.View.extend({ 
    events: { 
     'click .search' : 'searchKey' 
    }, 

    initialize: function(options) { 
     this.eventModel = options.eventModel; 
    }, 

    searchKey: function(event) { 
     this.eventModel.trigger('search', event) 
    } 
}); 

var ReactingView = Backbone.View.extend({ 
    initialize: function(options) { 
     this.listenTo(options.eventModel, 'search', this.onSearch); 
    }, 

    onSearch: function(eventModel, event) { 
     console.log("Search was clicked!"); 
    } 
}); 

var eventModel = new Backbone.Model(); 

new ViewWithSearch({ 
    eventModel: eventModel 
}).render(); 

new ReactingView({ 
    eventModel: eventModel 
}).render(); 

Это, безусловно, сложнее, чем глобальное событие, но это также верно для MV* дизайна. Вы получаете красиво развязанный набор взглядов, которые ничего не знают о себе «вне», что упрощает их обслуживание (и тестирование!).

Существует множество библиотек, которые предоставляют такую ​​функциональность; например, Backbone.Radio построен именно для такого рода вещей.