Click here to Skip to main content
14,774,472 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I need to be able to create a table that dynamically creates child/nested columns.
Maximum is 3 levels.
For example, if you click on 'Split' in a column on level 1, it will automatically generate a second level with 2 columns nested under it. If you click again on 'Split' in the same column in level 1, it will add another column to the 2nd level nested under it. So on and so forth.

This must all be stored in the database.

What I have tried:

I have this block of hard-coded table:

<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
    border: 1px solid black;
}
</style>
</head>
<body>

<table>
  <tr>
    <th rowspan=3>Month</th>
    <th colspan=3>Savings</th>
    <th rowspan=3>Savings for holiday!</th>
  </tr>
  <tr>
  <td colspan=2>Daily</td>
  <td>Weekly</td>
  </tr>
  <tr>
  <td>1</td>
  <td>2</td>
  <td>1</td>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
    <td rowspan="2">$50</td>
    <td>$56</td>
    <td>$45</td>
  </tr>
  
  <tr>
    <td>February</td>
    <td>$80</td>
    <td>$34</td>
    <td>$48</td>
  </tr>
</table>

</body>
</html>


But the values here are fixed.
Output: Table
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900