jquery plugin Datatable :using rowspan in tbody causes wrong

Question

I am using one jQuery plug-in called DataTables:

http://www.datatables.net/

The plugin doesn't support rowspan in tbody

<tr class="colorrow">   
    <td id="greater" rowspan="3">TMMS</td> 
    <td>Case Volume</td> 
    <td>0</td> 
    <td>0</td> 
    <td>0</td> 
    <td>1</td> 
    <td>1</td>
</tr>

Is there any other solution for this?

Answer 1

Try this. Just apply css "display:none;" where you want to apply rowspan.

<table id="example">
<tr class="colorrow">   
    <td id="greater" rowspan="3">TMMS</td> 
    <td>Case Volume</td> 
    <td>0</td> 
    <td>0</td> 
    <td>0</td> 
    <td>1</td> 
    <td>1</td>
</tr>
<tr class="colorrow">   
    <td style="display: none;">TMMS</td> 
    <td>Case Volume</td> 
    <td>0</td> 
    <td>0</td> 
    <td>0</td> 
    <td>1</td> 
    <td>1</td>
</tr>
<tr class="colorrow">   
    <td style="display: none;">TMMS</td> 
    <td>Case Volume</td> 
    <td>0</td> 
    <td>0</td> 
    <td>0</td> 
    <td>1</td> 
    <td>1</td>
</tr>
</table>

Put same script for datatable.

<script type="text/javascript">
      $(document).ready(function() {
            $('#example').DataTable();
      });
</script>

Answer 2

http://datatables.net/plug-ins/api#fnFakeRowspan