CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrap
unseen
unseen

Reputation: 7

How to add a button into a table

So right now I have a function that adds the correct number of cells to the bottom of my table, upon a button click.

JS for adding a row: 

<a href="javascript:myFunction();" title="addRow" class="btn btn-info" id="row">Add Row</a> 
      <script>
      function myFunction() {
          var table = document.getElementById("data-table");
          var row = table.insertRow(-1);
          var cell1 = row.insertCell(0);
          var cell2 = row.insertCell(1);
          var cell3 = row.insertCell(-1);
          var cell4 = row.insertCell(-1);
          var cell5 = row.insertCell(-1);
          var cell6 = row.insertCell(-1);

          cell1.innerHTML = "Video File Name";
          cell2.innerHTML = "Original File Size";
          cell3.innerHTML = "23432";
          cell4.innerHTML = "23423";
          cell5.innerHTML = "2342";
          cell6.innerHTML = "Compress";

      }

How can I add a button into my 6th cell when I click on my add row button?

Upvotes: 0

Views: 148

Answers (1)

Rion Williams
Rion Williams

Reputation: 76557

Simply change the contents of your sixth cell (i.e. cell6) to explicitly include a button when setting the innerHTML property :

// This sets the HTML within your cell, so include whatever you need within it
cell6.innerHTML = "<button>Compress</button>";

Upvotes: 4

Related Questions