Repeat a table multiple times on same page

Question

I have a fairly complicated html table containing lots of PHP, CSS etc., and it comprises about 200 lines of code. I need to reproduce the table in three different areas on my webpage. What is the best approach to replicating the table the 2nd and 3rd time so that I don't have to copy and paste the 200 lines of code each time? Surely there must be a best-practice for doing this.

Answer 1

You can just use include files, then put a reference to the include file on each page where you want the table.

<?php include("table.php"); ?>

And more info from w3schools can be found here: http://www.w3schools.com/php/php_includes.asp

Answer 2

Are you using jQuery? Where does the data originate? Is it hard coded or in a database? You are correct in my opinion, you should never be adding even a 200 row table to your view (in the first place) that is coded in static HTML.

Please provide some detailed context for your problem and what you are trying to accomplish and I will try and help you out.

Answer 3

Here is a solution using PHP if you are quering your information from a database. This will make a new row for each result that is returned from your DB. I presume that with 200 different bits of information you are using a database for that?

Hope this helps you out somehow :)

EDIT : Just re-read the question, jumped the boat a bit there Im afraid (apologies) I suggest the poster above and his includes method :)

<table>
    <tr>

<?php

    // create query and make them load so the most recent shows first
    $query = "SELECT * FROM ourtable ORDER BY id DESC";

    // execute query
    $result = mysql_query($query) or die ("Error in query: $query. ".mysql_error());

    while($row = mysql_fetch_row($result)) {
        echo "<td>".$row[0]."</td>";

    }    
?>
    </tr>
</table>

Answer 4

Put a div wrapper around the table with an id. then put empty divs in the other spots it needs to go then:

<script type="text/javascript"
function dupTable()
{
    str=document.getElementById('tableWrapper').innerHTML;
    document.getElementById('dest1').innerHTML=str;
    document.getElementById('dest2').innerHTML=str;
}
onload=dupTable;
</script>