2011-11-15 4 views
0

J'ai une vue qui comprend une table.Déclencher des événements dans les sous-vues de Backbone.js

var newsIndexView = Backbone.View.extend({ 
    ... 
}); 

Chaque ligne de la table est une autre vue associée à un modèle.

var newsItemView = Backbone.View.extend({ 
    tagName: "tr", 
    ... 
    selectRow: function(e){ 
    this.selected = !this.selected; 
    $(this.el).toggleClass("selected"); 
    if(this.selected){ 
     $(".delete_many").on("click", $.proxy(this.remove, this)); 
    }else{ 
     $(".delete_many").off("click", $.proxy(this.remove, this)); 
    } 
    }, 

    ... 

}); 

L'utilisateur peut sélectionner des lignes. Lorsque 1 ou plusieurs lignes sont sélectionnées, un bouton de suppression apparaît. Lorsque le bouton (.delete_many) est sélectionné, je veux déclencher l'événement delete pour chaque newsItemView sélectionné. Comme vous pouvez le voir quand une ligne est sélectionnée, j'ajoute un gestionnaire d'événement pour le supprimer et je le retire quand il n'est pas sélectionné. Je me demandais s'il y avait une meilleure façon de faire cela?

Répondre

2

Impossible d'utiliser delegateEvents sur la vue qui gère la table pour installer le gestionnaire de clics une fois? Il devrait tirer, même si les boutons ont été ajoutés plus tard (et rester autour même si les boutons sont retirés plus tard).

var newsIndexView = Backbone.View.extend({ 
events: { 
    "click .deleteMany" : "deleteMany" 
}, 
... 

La fonction deleteMany déterminerait ensuite quelles lignes sont sélectionnées et les supprimera dans une boucle. Comme le bouton appartient à la table dans son ensemble (et non à des lignes individuelles), cela semble plus naturel. Cela faciliterait également l'affichage d'une boîte de dialogue de confirmation «êtes-vous sûr» (que vous souhaitez afficher une seule fois et non chaque ligne) et l'utilisation de fonctions de suppression en bloc de votre serveur (une requête au lieu d'une par ligne)).

+0

Si je le fais à partir de l'indexView, je pense que je devrais stocker l'ID de chaque modèle dans le DOM. Je pense que votre solution est logique, mais est-il possible de ne pas stocker d'ID de modèle dans le DOM (par exemple, data-id = "1")? – LDK

+0

N'y a-t-il pas une collection de modèles qui correspond 1-à-1 (dans le même ordre) aux vues et au DOM TR? Sinon, oui, attachez l'id du modèle au DOM. – Thilo

Questions connexes