Testing DataTables

http://datatables.net/

HTML

<script src="//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="//ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css">
<script src="//appliedinter.net/Workstream/common_files/js/modernizr.custom.40623.js"></script>
<table cellpadding="0" cellspacing="0" border="0" class="datatable" id="example" width="100%">
	<thead>
		<tr>
			<th>Name</th>
			<th>Date of Birth</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>Jeromy</td>
			<td>08-MAY-2012</td>
		</tr>
		<tr>
			<td>Bill</td>
			<td>01-JAN-2013</td>
		</tr>
		<tr>
			<td>Anne</td>
			<td>31-DEC-2011</td>
		</tr>
		<tr>
			<td>Jessica</td>
			<td>15-JUN-2010</td>
		</tr>
	</tbody>
</table>

<table cellpadding="0" cellspacing="0" border="0" class="datatable" id="example" width="100%">
    <caption>Title Town</caption>
	<thead>
		<tr>
			<th>Team</th>
			<th>Last Champioship</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>Bruins</td>
			<td>15-JUN-2011</td>
		</tr>
		<tr>
			<td>Celtics</td>
			<td>17-JUN-2008</td>
		</tr>
		<tr>
			<td>Patriots</td>
			<td>06-FEB-2005</td>
		</tr>
		<tr>
			<td>Red Sox</td>
			<td>28-OCT-2007</td>
		</tr>
	</tbody>
</table>

JavaScript

// Put these somewhere better than a global :)
var months = "JAN_FEB_MAR_APR_MAY_JUN_JUL_AUG_SEP_OCT_NOV_DEC".split("_");
function monthToOrd(month) {
    return $.inArray(month, months);
}
function customDateToOrd(date) {
    // Convert to a number YYYYMMDD which we can use to order
    var dateParts = date.split(/-/);
    var day = dateParts[0];
    var month = monthToOrd(dateParts[1]);
    var year = dateParts[2];
    var numericDate = (year * 10000) + (month * 100) + day;
    return numericDate;
}
            
// This will help DataTables magic detect your custom format
// Unshift so that it's the first data type (overridding in built ones)
jQuery.fn.dataTableExt.aTypes.unshift(
	function ( sData )
	{ alert(sData );
        // You might want to make this check a little tighter so you don't match
        // invalid dates, but this should do for now
        if (sData.match(/\d{2}-[A-Za-z]{3}-\d{4}/))
            
            return 'custom-date';
        else
            return null;
    }
);

// define the sorts
jQuery.fn.dataTableExt.oSort['custom-date-asc']  = function(a,b) {
    var ordA = customDateToOrd(a);
    var ordB = customDateToOrd(b);
    return (ordA < ordB) ? -1 : ((ordA > ordB) ? 1 : 0);
};

jQuery.fn.dataTableExt.oSort['custom-date-desc'] = function(a,b) {
    var ordA = customDateToOrd(a);
    var ordB = customDateToOrd(b);
    return (ordA < ordB) ? 1 : ((ordA > ordB) ? -1 : 0);
};

$(document).ready(function() {
    $('html').addClass('lt-ie9');
   $('table.datatable').dataTable();
} );