May 02, 2011 · An additional column is added to the table, containing the expand/collapse buttons that enable the user to expand the selected table row; When the user clicks on the expand button, an AJAX call is sent to the server and the HTML for the details will be returned; HTML that is returned is injected as a sub-row using the DataTables fnOpen function ...
If I did understand correctly, you want only the rows of the first table to have the expand/collapse functionality. Is that right? If so, you need to tell JQuery only to get the direct children of the #report table.
In this tutorial we will show you how to expand table rows using jQuery, HTML and CSS when user clicks on a row a box with some additional details will show and when user again clicks on that row box will hide.You may also like pricing table using HTML and CSS.