How would you avoid having multiple tables containing the same data?

JavaScript
1

Hi.

Say that you have a table with id Testresults.
Now you also would like to show diffrent parts of that table inside diffrent divs that also contain a table.

for example

<div id="OK testcases">
<table id="oktestdiv">
<tr id="row1" class="ok"><td>ok</td></tr>
</table>
</div>


<div id="Failed testcases">
<table id="failedtestdiv">
<tr id="row2" class="failed"><td>failed</td></tr>
</table>
</div>



<div id="all testcases">
<table id="alltestdiv"
<tr id="row1" class="ok"><td>ok</td></tr>
<tr id="row2" class="failed"><td>failed</td></tr>
</table>
</div>

And those rows were taken from the following table


<table id="testresults">
<tr id="row1" class="ok"><td>ok</td></tr>
<tr id="row2" class="failed"><td>failed</td></tr>
</table>

So how could you accomplish this?

I naturally don’t want to write the code for the table at multiple places of the page. Notice also that my site only contains of one site, containing many divs.

Thanks :slight_smile:

2

Since a significant percentage of your visitors will not have JavaScript you’d be better to use a server side language to do it rather than have it only work for some visitors.

3

Using jquery you could do something like:

$(“#mylink”).click(function() {
$(“div#OK”).append($(“#testResults”));
});

or use could use the prepend function depending on whether you want the content to appear before or after the existing HTML.