0

我有一个视图,它在使用数据表插件呈现的表中添加了一个新行。我希望每一行都附加一组特定的事件。这是视图:

var newRow=Backbone.View.extend({

        el:".datatable",


        events:{
            'click .edit':'edit',
            'click .delete':'delete'
            },


            render: function()
            {

                data=this.model.toJSON();
                this.$el.dataTable().fnAddData([data.name,data.email,data.contact_number,'<span style="cursor:pointer" class="delete">Delete</span>']);
                return this;
            },


            edit:function(){
                alert("edit");
            },

            delete:function(){
            alert("delete");
            }
        })

现在,当我单击一行上的删除时,它会触发所有行的事件,并且我会收到与行一样多的警报。我明白问题是什么。由于我已将 el 作为整个表,因此它会在所有行中附加事件。有什么办法可以解决这个问题?我需要使用数据表。对于简单的表,我应该只使用 el 作为“tr”,但真的不知道如何实现我目前的愿望。

4

1 回答 1

1

如果有人在这个问题上苦苦挣扎,请像我一样使用数据表中的 fnAddTr 插件:

var newrow=Backbone.View.extend({            

       tagName:"tr",

        events:{
            'click .edit':'edit',
            'click .delete':'delete'
            },


            render: function()
            {

            data=this.model.toJSON();

            this.$el.html('<td>'+data.name+'</td><td>'+data.email+'</td><td>'+data.contact_number+'</td><td><span class="delete">Delete</span> | <span class="edit">Edit</span></td>');
            return this;
            },


            edit:function(){
                alert("edit");
            },

            delete:function(){
            alert("delete");
            }
            });

并在调用函数中添加 tr 元素,如下所示:

var Instance=new newRow({ model:myModel});
$('table').dataTable().fnAddTr(Instance.render().el);

所以这条线是关键$('table').dataTable().fnAddTr(Instance.render().el);

希望这可以帮助某人。

于 2013-02-01T11:51:12.047 回答