Home/ Questions/Q 8770795
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T17:37:45+00:00

I am looking to have a function, that when pressing a button, the function

  • 0

I am looking to have a function, that when pressing a button, the function generates rows/colums.

I’ve been trying with the following code

 function addTRTD(){ 
 var tbElm = document.getElementById("tbdy");

 var newRow = document.createElement("tr");

 var newCol1= document.createElement("TD");
 var newCol2= document.createElement("TD");


 newCol1.innerHTML = "Row 1 Cell 1";
 newCol2.innerHTML = "Row 1 Cell 2";;


 newRow.appendChild(newCol1);
     newRow.appendChild(newCol2);


 tbElm.appendChild(newRow);


     newCol1.innerHTML = "Row 1 Cell 1";
     newCol2.innerHTML = "Row 1 Cell 1";



     var newRow = document.createElement("tr");
     newRow.appendChild(newCol1);
     newRow.appendChild(newCol2);

     var newCol1= document.createElement("TD");
     var newCol2= document.createElement("TD");

     newCol1.innerHTML = "Row 2 Cell 1";
     newCol2.innerHTML = "Row 2 Cell 2";


 tbElm.appendChild(newRow);
 }

but no luck. Clicking on the button I just get the following output
Row 1 Cell 1 Row 1 Cell 2

how can I get to display information of Row2?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The solution for me was:

    <html>
<head>
<title>Auto-Gen</title>

<script type="text/javascript">

var template = '</table>\
<div align="justify">\
<td>\
<select name="name{num}" title="25">\
<option value="1">1</option>\
<option value="2">2</option>\
<option value="3">3</option>\
<option value="4">4</option>\
<option value="5">5</option>\
<option value="6">6</option>\
<option value="7">7</option>\
<option value="8">8</option>\
<option value="9">9</option>\
<option value="10">10</option>\
<option value="11">11</option>\
<option value="12">12</option>\
<option value="13">13</option>\
<option value="14">14</option>\
<option value="15">15</option>\
<option value="16">16</option>\
<option value="17">17</option>\
<option value="18">18</option>\
<option value="19">19</option>\
<option value="20">20</option>\
<option value="21">21</option>\
<option value="22">22</option>\
<option value="23">23</option>\
<option value="24">24</option>\
<option value="25">25</option>\
<option value="26">26</option>\
<option value="27">27</option>\
<option value="28">28</option>\
<option value="29">29</option>\
<option value="30" selected="selected">30</option>\
<option value="31">31</option>\
<option value="32">32</option>\
</select>\
</td>\
<td>\
    {num}\
 </td>\
</div>';

var counter =0;

function addNew() {
    a = document.createElement('div');
    html = template.replace(/{num}/g, counter.toString());
    a.innerHTML = html;
    var mainContainer = document.getElementById('mainContainer');
    mainContainer.appendChild(a);
    counter++;
}

</script>
</head>
<body>

<div id="mainContainer"> </div>

<div align="justify"> <input value="Add" onclick="addNew()" type="button"> </div>

</body>
</html>

    Thank you very much everyone for your comments and help

    Regards

    • 0