2016-09-07 6 views
1

Es ist möglich, klicken Sie Ereignis, wenn Datatable baut die Zeilen?, Ohne externe globale Funktion aufrufen und das Schließen tr und DATA-Objekt erhalten?.JavaScript - jquery DataTable Schaltfläche zum Anhängen an Zeile + Klick-Ereignis

$('#example').DataTable({ 
    columns : [{ 
     title : 'msg', 
     sClass : 'col-sm-2', 
     render : function(data, type, row){ 
      var b = $('<button>the button</button>').click(function(){ 
       alert(row.msg); 
      }) 
      return b; 
     } 
    }], 
    ajax:{ 
     type : 'POST', 
     url : 'foo.php', 
    } 
}); 

ich kenne das obige Beispiel dosnt Arbeit, cos Renderfunktion muss String zurückgeben, es ist nur ein Beispiel für das, was ich brauche.

  • ein Element erstellen.
  • anhängen klicken Funktion übergeben 'Zeile' Objekt, mit out globalen Funktion aufrufen.

Antwort

1

Kurze Antwort, nein, Sie können nicht. Ich sehe Sie nicht - wollen, aber ich würde eine Klasse und Event-Delegation verwenden, wie folgt aus:

var myDataTable=$('#example').DataTable({ // note the stored reference to the dataTable 
    columns : [{ 
     title : 'msg', 
     sClass : 'col-sm-2', 
     render : function(data, type, row){ 
      return '<button class="some-class">the button</button>'; 
     } 
    }], 
    ajax:{ 
     type : 'POST', 
     url : 'foo.php', 
    } 
}); 


$(document).on('click', '.some-class', function(){ 
     var $btn=$(this); 
     var $tr=$btn.closest('tr'); 
     var dataTableRow=myDataTable.row($tr[0]); // get the DT row so we can use the API on it 
     var rowData=dataTableRow.data(); 
     console.log(rowData.msg); 
}); 

Technisch Sie die rowCallback function verwenden könnte den Handler zu befestigen, nachdem jede Zeile gerendert, aber Sie müssten .find() oder ähnliches verwenden, um zu der Schaltfläche zurückzukehren, und der oben beschriebene Ansatz ist viel sauberer IMHO.

Verwandte Themen