I have 2 add button. First add button on header, click this button will add 1 new row. Second add button in table (such as image on my post), click this button will add new row such as image my post. I want add row in table such as below image, but i haven't thought of a solution yet. Hope to be got your helps!
Add a comment
|
2 Answers
The insertRow() method allows you to add rows to a <table> and returns a reference to a new row. Adding that to an onClick() function should be easy! :)
Here's the relevant information on Mozilla's site .
2 Comments
Trinh Thien An
Thanks you so much! But, your link haven't solved my problem yet. :( :( I have 2 add button. First add button on header, click this button will add 1 new row. Second add button in table (such as image on my post), click this button will add new row such as image my post.
VoronoiPotato
I believe you'll just need to do the same thing again.
To solve this, you have to add a new table inside td, like this
function addNewRow() {
let table = document.getElementById("add");
table.innerHTML += '<table><tr><td><b>This is a test</b></td></tr></table>';
} <html>
<body>
<button onclick="addNewRow()">Add</button>
<table id='my-table'>
<tr>
<td>This is one td</td>
<td id='add'>This is another td</td>
</tr>
</table>
</body>
</html>
2 Comments
Trinh Thien An
Thanks you so much! Your link haven't solved my problem yet. I have 2 add button. First add button on header, click this button will add 1 new row. Second add button in table (such as image on my post), click this button will add new row such as image my post.
Murilo Pereira
@TrinhThienAn please, try the snippet