render in datatable repeat the data on click

davidnroll

Hello, I have this datatable and I need to put two buttons, edit and delete, and when I click on the delete button, I get 4 alerts, this is my code.

     var table =  $('#tablaEncuestas').DataTable(

        {"data": tableapi,
         "responsive": true,
         "columns" : [

                        { "data" : "from_module"},
                        { "data" : "name"},
                        { "data" : "name_template"},
                        { sortable: false,
                          "render": function ( data, type, full, meta ) {
                            var delID = "del_"+full.id;
                            var editID = "edit_"+full.id;
                            var id_del = full.id;

                              $('#tablaEncuestas tbody').on('click','#'+delID+'', function () {

                                alert(this.id);

                                });

                            return '<button id='+editID+'>Editar</button><button id='+delID+' class="">Eliminar</button><label>id: '+id_del+'</label>';

                        },

                    },

                  ],

                "columnDefs" :[

                  {"className" : "dt-center", 
                  "targets": "_all"}

                  ],

                "pagingType" : "full"

            });

kthorngren

You are creating multiple click event handlers, one for each row, that will execute when clicking the row. See if this example helps:
http://live.datatables.net/xijecupo/1/edit

It creates one click handler for all the buttons.

Kevin