Backbone.js adjuntar vista a múltiples elementos

Question

Soy bastante nuevo en la columna vertebral, por lo que es posible que esté violando la esencia misma de la estructura al hacer esto. Las sugerencias son apreciadas:

He hecho una especie de sistema de pared. Entonces, hay un formulario que se puede usar para publicar actualizaciones en la pared.

Cada actualización puede tener comentarios al respecto. Estoy mostrando 10 actualizaciones a la vez. Entonces hay 10 formularios de comentarios. Así que tienen una visión:

CommentForm=Backbone.View.extend({ 
initialize:function(messageView){ 

}, 
events:{ 
    "submit":"postcomment" 
}, 
showMessage:function(data){ 
     if(data.success) 
      type="success"; 
       else 
      type="error"; 
      message=data.error?data.error:"Update posted successfully"; 
      $messageContainer=$this.prev(); 
      console.log($this); 
      var html="<div class='alert alert-"+type+"'>"+message+"</div>"; 
      $($messageContainer).html(html); 
}, 
postcomment:function(){ 
     $this=$(this.el); 

     $.post(baseUrl+"/portal/post-comment",$this.serialize(),this.showMessage,"json"); 
     return false; 
} 


    }); 

Ahora puedo crear una instancia de la siguiente manera:

commentFormView= new CommentForm({el:$(".comment-form form")}); 

Tenga en cuenta que .comment-forma es un div. Hay múltiples tales elementos. El controlador de eventos se adjunta a todos los formularios de comentarios muy bien. Pero cuando uso $this=$(this.el);, siempre se refiere al primer formulario de comentarios. Cómo puedo solucionar esto. $ (this.el) debe referirse a la instancia actual del formulario de comentarios, donde se desencadenó el evento y no el primero

Answer 1

Una forma sería crear una nueva vista para cada elemento usando algo como esto.

$(".comment-form form").each(function() { 
    new CommentForm({ el: $(this) }); 
}); 

---

Editar hay otra manera (mejor?). Debido a que el controlador de eventos recibe el evento en bruto como primer parámetro, se puede escribir el manejador postcomment así:

postcomment:function(evt){ 
    // ... 
} 

continuación, puede utilizar $(evt.srcElement) para obtener el elemento real.

postcomment:function(evt){ 
    $this = $(evt.srcElement); 
    // ... 
} 

Answer 2

$ ('formulario de comentarios-form') devolverá una matriz de todos los elementos del formulario correspondiente. Necesita iterar a través de esa matriz y crear una vista para cada elemento, como dbaseman mostró.

Además, en lugar de hacer

$this=$(this.el) 

vistas columna vertebral ya proporcionar una jQuery envuelto el:

this.$el