CODEWITHSUNDEEP
javascriptphpjquerydatatable
georgetovrea
georgetovrea

Reputation: 577

Jquery Datatables : How to get row.data when click the the button in one column?

[![enter image description here][1]][1]i have a nested table , I want to having button to generate the row data to info.php by post method (looks like info.php?user = data[0] & key2 = data2) in one column for each row , I have one button but I need one button and perform some MySql when they are clicked to get the row data . when click the button will get to every columns data in the row and post these data to info.php and view in popup window,

How can I perform post the row data in the nested datatable to other php using the button?

my code

click the button ,cannot get the row data ?

$('#example tbody').on( 'click', 'button', function () {
     var index = $(this).closest('tr').index();
     var data = table.row( $(this).parents('tr') ).data();
      alert("References is "+ data[0] +"and section is "+ data[ 1 ]+ " and Stature Titles is "+data[2] );
} );

Upvotes: 0

Views: 7360

Answers (1)

Beginner
Beginner

Reputation: 4153

-UPDATED
just add class for button class='button-info'

 columns:[ 
   { data:'name' },
   { data:'position' }, 
   { data:'salary' },
   {
      "targets": -1,
       "data": null,
      "defaultContent": "<button class='button-info'>Click Me!</button>"
   }
 ]

first assign index value for every parent row

$("table tbody tr").each(function(index) {
    $(this).attr('index', index);
})

then add new event for click event of that button and get the parent tr index just get the index of your selected parent row using data attribute "index" added above

 var parent = $(this).closest('table').parents('tr').index();
 var parentIndex = $('tbody tr:nth-child('+(parent)+')').attr('index');

and to get your current row in nested data

var index = $(this).closest('tr').index();

so this is the final

$('table').on( 'click', 'td .button-info', function () {
    var parent = $(this).closest('table').parents('tr').index();
    var parentIndex = $('tbody tr:nth-child('+(parent)+')').attr('index');
    var currentIndex = $(this).closest('tr').index();
    var data = sections[parentIndex][currentIndex];
    console.log(data);
    return;
    window.open("/info.php?name=" + data.name + "&sal=" + data.salary);
} );

See this updated JSFiddle

Upvotes: 3

Related Questions