Асинхронная загрузка данных Backbone.js

Добрый день! Я продолжу писать статьи о том, что пришлось писать на Backbone.js в ходе работе и с чем вы можете столкнуться. Сегодня речь пойдет про асинхронную загрузку данных, а точнее данных которые часто нам нужны на сайте.

Припустим на сайте можно добавлять разные типы данных (картинка, текст, аудио), но эти типы могут расширяться. Возможные типы хранятся в базе данных. Каждый раз доставать с базы очень накладно. Нам надо один раз достать и использовать.

Так мы загрузим данные:

app.models.dataTypes = new DataTypesCollection(); app.models.dataTypes.fetch(); 

Теперь в любом месте показываем пользователю app.models.dataTypes.Но у нас возможен один прокол, что если пользователь сразу зайдет на ту страницу, где нам нужно это поле? Для этого создадим событие, что данные получены.

app.models.dataTypes = new DataTypesCollection(); app.models.dataTypes.fetch({ 	success: function() { 		Backbone.history.trigger("dataTypesLoaded"); 	} }); 

Теперь нам нужно «словить» это событие. Для этого я написал функцию loadDataTypes, которая принимает в качестве параметра место, где надо расположить данные (place). Потому что у меня на одной странице нужно отобразить этот блок в нескольких местах. (Добавление и редактирование данных происходит на одной странице).

function loadDataTypes(place) { 	place.empty(); // очищаем место 	var addDataTypes = function() { // функция добавления данных 		_.each(app.models.dataTypes.models, function(item) { 			item.set("value", item.get("data_type_code")); 			item.set("text", item.get("data_type_name")); 			var selectItem = new SelectItemView({ // вид для optionа 				el: place, 				model: item 			}); 			selectItem.render(); // выдаем 		}); 	} 		 	if (app.models.dataTypes.models.length != 0) { // если загружены 		addDataTypes(); 	} else { // еще не загружены, "ловим" событие. 		Backbone.history.on("dataTypesLoaded", addDataTypes);  	} } 

Таким образом, мы загружаем данные, например при первой загрузке и потом выдаем в нужном месте.

Но если говорить обобщенно, то таких полей у нас может быть большое количество. Для всех полей пишем аналогичные функции и все данные будут загружаться асинхронно с выводом по мере загрузки. Пользователь даже не заметит, как быстро все загрузилось.

С плюсов мы получили то, что данные забираем с сервера только один раз и потом их используем сколько хотим. Тем самым не навредив пользователю.

P.S. Если надо описание SelectItemView, пишите я могу дописать, но там все тривиально.