Question

I have read the documentation and I am able to display the table on my page, but how would I make each row clickable and using a GET request, send the requested data to another page after clicking on a row? I have read other questions on SO, but can't seem to find a solution that would work for me. This is what I have so far. Thank you for any help and effort!

<table cellpadding="1" cellspacing="1" id="scroll">
<thead>

        <th>Name</th>
        <th>Address</th>
        <th>Age</th>

</thead>
<tfoot>
    <tr>
        <th>Name</th>
        <th>Address</th>
        <th>Age</th>
    </tr> 
</tfoot>
<tbody>
    <tr>
        <td> Placeholder1</td>
        <td> Placeholder2</td>
        <td> Placeholder3</td>
    </tr>
    <tr>
        <td> Placeholder1</td>
        <td> Placeholder2</td>
        <td> Placeholder3</td>
    </tr>
    <tr>
        <td> Placeholder1</td>
        <td> Placeholder2</td>
        <td> Placeholder3</td>
    </tr>
</tbody>
</table>



<script>
$(document).ready(function(){
   var table = $('#scroll').dataTable( { "sPaginationType": "full_numbers" } );


   $('#scroll tbody').on('click', 'tbody tr', function(){
    var data = table.row(this).data();
    console.log(data);
   })
});

Answer 1

JQUERY part:

$(document).off( "click", "#scroll tbody tr").on( "click", "#scroll tbody tr", function(){
    var i = 0;
    var query = "";
    $(this).find("td").each(function(){
        query += "columns[" + i++ + "]=" + $(this).text + "&";
    })
    $.ajax({
       type: "POST",
       url: "script.php",
       data: query,
       success: function(){
         alert ("Successfully sent");
       }
    })
})

PHP part (script.php)

<?php
   $columns = $_POST["columns"];
   foreach ($columns as $index => $value)
   {
     // do something with column # $index and text value is $value
   }
?>

Answer 2

var data = table.row(this).data();

这会返回行对象，因此您需要更改 console.log(data); 至 console.log(data[0] + " " + data[1] + " " + data[2]);

Answer 3

我发现mmushtaq将文档链接到我需要的地方。这使得行现在可以点击。谢谢

How to make Datatable row clickable and use GET request with result?

3 个答案: