Каждый пишет код как ему нравится. Я раньше разделял view и model у одного и того же элемента управления на странице, но устанавливать обработчики событий в view не очень удобно - нет гибкости у селекторов. Приходится использовать delegate, который и в модели встает хорошо, в конечном итоге использую одни model-и и коллекции. Знаю что возможно не использую весь потенциал движка, но того что дает объект model мне вполне хватает на все что необходимо. Когда код становится большим, может появиться неразбериха, куда ты воткнул ту или иную функцию - в модель или ее отображение.
Что касается примера, то движок я переписываю, вот набросок небольшой, там смысл будет понятен в принципе
Big_model=Backbone.Model.extend({
elid:'',
set_shapes:function(){
this.shapes_block=$(this.el).find('>.shapes');
var that=this;
this.shapes_block.find('>*').each(function(){
var name=$(this).attr('name');
that['shape_'+name]=$(this).children().clone();
})
},
set_data:function(){
this.data_block=$(this.el).find('>.data');
var that=this;
this.data_block.find('>*').each(function(){
var name=$(this).attr('name');
// console.log($(this).html())
if (!full_null($(this).html())){
switch (name){
case 'ajax':
that.ajax_param=JSON.parse($(this).html());
default:
that[name]=JSON.parse($(this).html());
}
}else
that[name]='';
})
},
set_elid:function(){
this.elid=elid;
this.el.attr('elid',this.elid)
elid++;
},
set_param:function(options){
this.el=options.el;
this.parent=options.parent;
this.set_shapes();
this.set_data();
this.set_elid();
this.set_def_el();
this.set_cus_events();
},
set_def_el:function(){//пользовательские элементы
},
set_cus_events:function(){//Установка событий
},
})
App=Big_model.extend({//Модель приложения основная
bm:{},//Массив моделей
initialize:function(){
this.set_param({el:$('body')});
this.ajax=new Ajax();
console.log('Арр загружен');
},
init_bm_scan:function(){
var that=this;
this.el.find('.big_model').each(function(){
that.init_bm($(this));
})
},
init_bm:function(model){
if (!fn(model.attr('elid'))) return;//Объект ранее уже инициализировался и ему присвоен id;
var type=model.attr('type');
var class_name=window[type];
if (this.bm[type]== undefined) this.bm[type]=[];
this.bm[type].push(new class_name({el:model}));
},
init_bm_sub:function(options){
var type=options.el.attr('type');
// console.log(type)
var class_name=window[type];
return new class_name(options)
}
})
Ajax=Big_model.extend({
ajax_proceed_url:'php/ajax_proceed.php',
send_st:function(param){
var result=''
$.ajax({
type: 'POST', dataType: 'json',
url:MAIN_URL+this.ajax_proceed_url,async: false,
data:({data:param.data,task:param.task,class:param.target.class,file:param.target.file}),
success: function(data){
result=data;
},
error: function(jqXHR, textStatus, errorThrown){
console.log(textStatus);
}
});
return result;
},
})
$(window).load(function(){
$(document).ready(function() {
elid=1;
app=new App;
app.init_bm_scan();
})
})