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

Question

[![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] );
} );

yeah. if you could post your html and what your have tried so far, that would be great :) — Venkata Krishna
– Venkata Krishna, Commented Oct 24, 2016 at 15:20

Beginner · Accepted Answer · 2016-10-25 05:04:43Z

3

-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

edited Oct 25, 2016 at 5:04

answered Oct 25, 2016 at 2:02

Beginner

4,1183 gold badges19 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

25 Comments

georgetovrea Over a year ago

hi Newbee Dev, from your code ,it's get the parent data not nested datatable data, I want to get nested datatable data not parent data , I have update my code ,but still cannot work ,can you help me how to fix ?

Beginner Over a year ago

ah okay. my mistake

Beginner Over a year ago

@user6556472 it's okay now check it

georgetovrea Over a year ago

yes, alert data is that I wnat , but how to post these data to popup info.php like info.php?name = data.name & sal = data.salary when click the button ?

Beginner Over a year ago

@user6556472 you want to redirect to that page?

|

Collectives™ on Stack Overflow

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

1 Answer 1

25 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

25 Comments

Your Answer

Sign up or log in

Post as a guest

Related