Recently, whilst working on an ASP.NET project, I had the requirement to dynamically add rows and columns to any position within a HTML table. This turned out to be a little more complicated than I had hoped as adding rows or columns into the middle of the table is slightly trickier, but it’s easily achievable with a little bit of effort.
Fortunately, with some help from jquery and the html 5 data attributes it’s not difficult to insert a new row or column at any position within the table. The only caveat with my method is that it requires the table to start with the correct attributes, so we can select them with jquery.