nokheat nokheat - 1 year ago 253
Javascript Question

JQuery DataTable Cell from a row click

I am trying to implement a function on jquery datatable, that returns the 1st and the 4th column of a clicked row

i am following this example, which allows me to manipulate a clicked row

thinking that i can change this handler to do the read cell value procedures and use the value on my own logic

/* Add a click handler to the rows - this could be used as a callback */
$("#example tbody").click(function(event) {
$(oTable.fnSettings().aoData).each(function (){

i have also come over with this little code segment from dataTable forum

$('#example tbody tr').click( function () {
// Alert the contents of an element in a SPAN in the first TD
alert( $('td:eq(0) span', this).html() );
} );

may i have any pointer so i can get the 1st and 4th column of the clicked field?

next part
I have the above solved, thanks nick

however i have the next part of the problem. when i init the table
i use

/* Init the table */
oTable = $('#filetable').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "/crvWeb/",
"fnServerData": function ( sSource, aoData, fnCallback ) {
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
} );
} );

my servlet takes a dir request parameter and returns a listing to the datatable as json response.


how can i add and get serlvet response with post request so i can have my table updated?

Answer Source

You can use .delegate() easiest here, like this:

$("#example tbody").delegate("tr", "click", function() {
  var firstCellText = $("td:first", this).text();
  var fourthCellText = $("td:eq(3)", this).text();

You can try out a demo here

With .delegate() this refers to the <tr> since that's the click we're handling, making things quite a bit cleaner..and it's still only one event handler at the <tbody> level, not one per <tr>.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download