Example 1: The following example is implemented using HTML, CSS, and JQuery. It shows data of multiple people working in an organization about their age, salary, and job. By clicking on the row, the table expands and the description about that particular employee is displayed.
Example 2: The following example is implemented using HTML, CSS, and JQuery. In this table, profit and loss are displayed for multiple hotels. By clicking on any of the plus signs, a sub-table is displayed which informs about the hotel’s revenue in three different cities.
- How to make div height expand with its content using CSS ?
- How to make div width expand with its content using CSS ?
- How to make Bootstrap table with sticky table head?
- How to hide or show one record from an ng-repeat within a table based on ng-click?
- How to expand button with animation on hover using Vue.js ?
- How to create table with 100% width, with vertical scroll inside table body in HTML ?
- How to make Bootstrap popover appear/disappear on hover instead of click?
- How to add table row in a table using jQuery?
- How to remove table row from table using jQuery ?
- How create table without using <table> tag ?
- PHP | XMLReader expand() Function
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.