Abdel-rahman El-Carpenter Abdel-rahman El-Carpenter - 7 months ago 10
HTML Question

How To Add <td></td> tags to table after some actions

now i've written some HTML Tags,and some JS & PHP, and the PHP returns some data to the JS then to the HTML, by the return of this data i wanna change in the HTML form.

let's explain it:

The Html contains a table and i want to add some new rows and columns to this table by the returning of new data from php

How Can I Do It ... after i've closed the table tag " ???

Answer

To be short, to add a row into a table:

yourTable.appendChild(document.createElement("tr"));  //native

- or -

$("<tr>").appendTo(yourTable);                        //jQuery

To add a cell:

yourRow.appendChild(document.createElement("td"));    //native

- or -

$("<td>").appendTo(yourRow);                          //jQuery

To append HTML or text into newly-created nodes:

yourCell.innerHTML = "Your Text";

- or - 

$(yourCell).html("Your HTML"); / $(yourCell).text("Your text");

References: document.createElement Node.appendChild

A little demonstration: http://jsfiddle.net/DerekL/rS8H8/


You might need to request your data via XMLHttpRequest or $.ajax and apply the methods mentioned above to achieve the feature you wanted.

Comments