¿Cómo vincular eventos en botones dinámicos generados en la red troncal?

Question

¿Cómo vinculo evento click en los botones dinámicos generados en backbone.js?

window.PackageView = Backbone.View.extend({ 

    tagName: "div", 

    className: "package-template", 

    events:{ 
     'click #display-nodes' : 'main', // This button is declared in my HTML code and calls main method successfully. 
     'click .display'  : 'disp', // This is dynamic button generated with class as display 
    }, 

    getAction: function(nodeId){ // Get Actions from NodeId and generate buttons 
     $('.nodes').append("<button>" + action.Name + "</button>"); //Generate Buttons 
     $(".nodes button").addClass("display"); 
    }, 

    disp: function(){ 
     alert("Inside Disp Function"); 
    }, 

Al hacer clic en #display-nodes los nodos se muestran como necesaria pero .display no está funcionando. ¿Cómo hago que este botón llame a la función?

Answer 1

Una vista de Backbone puede recibir eventos de elementos DOM generados dinámicamente, a través de la propiedad events, siempre que los elementos DOM generados dinámicamente sean descendientes del el de la vista. El código relevante está en delegateEvents(). Utiliza el método selector de jQuery delegate().

La razón más probable por la que no funciona es que el recién creado <button> no es un descendiente de la vista el. ¿Estoy en lo cierto?

Si este es el caso y que desea mantener el elemento fuera de la vista de el, puede eliminarlo de la propiedad de su vista events y delegar en otro elemento en el método init de su vista.