Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82031

parent child datatables

$
0
0

Hi,

Its been a while, I am back again. trying to get parent and child datables on click of parent row.

here is my code

`<!DOCTYPE html>
<html>
  <head>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.css"/>

<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <meta charset=utf-8 />
    <title>DataTables -  Parent and Child</title>
  </head>
  <body>
    <div class="container">
      <table id="example" class="display nowrap" width="100%">
        <thead>
            <tr>

                <th>Id</th>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Address</th>
            </tr>
        </thead>

        <tfoot>
            <tr>

                 <th>Id</th>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Address</th>
            </tr>
        </tfoot>

        <tbody>
          <tr>

            <td>1</td>
            <td>xxx</td>
            <td>uyy</td>
            <td>dddd</td>
          </tr>
          <tr>

            <td>2</td>
            <td>dfff</td>
            <td>ddd</td>
            <td>dddd</td>
          </tr>
        </tbody>
      </table>
    </div>

<div>
      <table id="child" class="LogDetails"> 
        <thead>
            <tr>

                <th>Id</th>
                <th>Loged Date</th>
                <th>Loged Out Time</th>

            </tr>
        </thead>


      </table>
    </div>

  </body>
</html>`

my javascript

$(document).ready(function() {
    var table = $('#example').DataTable( {
        "columns": [
            {   "orderable":      true,
                "data":           null,
                "defaultContent": ''
            },
            { "data": "A" },
            { "data": "B" },
            { "data": "C" },
            { "data": "D" }
        ],
        "order": [[1, 'asc']]
    } );

    // Add event listener for opening and closing details
    $('#example tbody').on( 'click', 'button', function () {
    var data = table.row( $(this).parents('tr') ).data();
    editMember(data[0]);
} );

} );

Anyone around to help, so i can use ssp class to retrieve data from my sql database please?

OR

Just from the text file the child data?_


Viewing all articles
Browse latest Browse all 82031

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>