Count Items in DataTable and append to row ~ Andrew Pougher
JQuery Datatable: count any occurrences of a cell and show total as a count. ~ Andrew Pougher
HTML
<script src="http://datatables.net/release-datatables/media/js/jquery.dataTables.js"></script>
<link rel="stylesheet" href="http://datatables.net/release-datatables/media/css/demo_table.css">
<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
<tr>
<th>details</th>
<th>name</th>
<th>depart</th>
<th>Final Date</th>
<th>Destination</th>
</tr>
</thead>
<tbody>
<tr class="gradeA">
<td>+</td>
<td>John Bloggs</td>
<td>June 24th 2012 </td>
<td class="center">July 14th 2012</td>
<td class="center">Miami</td>
</tr>
<tr class="gradeA">
<td>+</td>
<td>John Bloggs</td>
<td>June 24th 2012 </td>
<td class="center">July 14th 2012</td>
<td class="center">Miami</td>
</tr>
<tr class="gradeA">
<td>+</td>
<td>John Bloggs</td>
<td>June 24th 2012 </td>
<td class="center">July 14th 2012</td>
<td class="center">Miami</td>
</tr>
<tr class="gradeA">
<td>+</td>
<td>John Bloggs</td>
<td>June 24th 2012 </td>
<td class="center">July 14th 2012</td>
<td class="center">Miami</td>
</tr>
<tr class="gradeA">
<td>+</td>
<td>John Bloggs</td>
<td>June 24th 2012 </td>
<td class="center">July 14th 2012</td>
<td class="center">Miami</td>
</tr>
<tr class="gradeA">
<td>+</td>
<td>John Bloggs</td>
<td>June 24th 2012 </td>
<td class="center">July 14th 2012</td>
<td class="center">Miami</td>
</tr>
<tr class="gradeA">
...
CSS
span.groupttl{
font-size:10px;
background:#cc1100;
height: 12px;
text-align:center;
width: 12px;
float:left;
margin-right:5px;
border:2px solid #fff;
color:#fff;
display:block;
position:absolute;
-moz-border-radius: 35px;
border-radius: 35px;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .4);
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .4);
}
JavaScript
$("#example tr").not(':eq(0)').not(':last').each(function(index, item) {
var m1 = $(this).find("td:nth-child(3)").text();
$(this).prepend("<span class='groupttl'>" + howmany(m1) + "</span>");
});
function howmany(m) {
var monthmatch = $("#example tr td:contains("+m+")").length;
return (monthmatch)
}
$('#example').dataTable();