How to omit data in some cells, where table is filled from xml file
I have xml file with data that i have to display in table. Now I am displaying all data row by row, so my table looks like:
User | Date | Something
John | 05.10| task_1
John | 05.10| task_2
John | 16.10| task_3
Jane | 16.10| task_1
but i want to get something like:
Us开发者_开发百科er | Date | Something
John | 05.10| task_1
| | task_2
| 16.10| task_3
Jane | 16.10| task_1
so if date in particular cell is equal to corresponding cell in previous row ( or if that cell is empty then is equal to first non empty cell looking from bot to top) I would like to omit it.
Current code:
<table id="DataTable" datasrc="#XMLData" cols="3">
<thead>
<tr>
<td class="Example">User</td>
<td class="Example">Date</td>
<td class="Example">Something</td>
</tr>
</thead>
<tbody>
<tr>
<td><span datafld="USER"></td>
<td><span datafld="DATE"></td>
<td><span datafld="SOMETHING"></td>
</tr>
</tbody>
</table>
note:
this problem is from existing (old) system and my options are limited. Particularly I cannot change xml file and I shouldn't use server based asp.net controls ( but I can if there is no other way / it's simplest solution), so I aim for pure html & javascript solution most.
If it needs to be something quick and dirty, use something like this.... I am hoping that you only have a single tBody ;) Tested as working in FF (will need some crossbrowser clean up. will leave that to you). you might want to clean up the prevName/name comparison to suit your needs
var tablemerge = {
init : function(){
var tab = document.getElementById("DataTable");
var prevName, prevDate;
for (i=0;i<tab.tBodies[0].rows.length;i++){
var name = tab.tBodies[0].rows[i].cells[0].innerHTML;
var date = tab.tBodies[0].rows[i].cells[1].innerHTML;
if (i== 0) {
prevName = name;
prevDate = date;
continue;
}
else{
if (name == prevName)
{
var cell = tab.tBodies[0].rows[i].deleteCell(0);
var cell = tab.tBodies[0].rows[i].insertCell(0);
if (date == prevDate)
{
var cell = tab.tBodies[0].rows[i].deleteCell(1);
var cell = tab.tBodies[0].rows[i].insertCell(1);
}
else{
prevDate = date;
}
}
else
{
prevName = name;
prevDate = date;
}
}
}
}
}
tablemerge.init();
Maybe you can try to create html using xslt. In this case you will be able to check dates in xslt.
精彩评论