title: Implementing a custom sSortType and sort function for jQuery dataTables
body: <p>I'm having a hard time following the instructions on the <a href="http://datatables.net/plug-ins/sorting">documentation</a> page. I have a table displaying the average time durations in one column, in the HH:MM format, e.g 10:45 means ten hours and forty-five minutes. I would like to be able to sort my entire table by the values in this column.</p>
  
  <p>Here is my initialization code : </p>
  
  <pre><code>    var aoTable = $("#TableStatistic").dataTable({
      "bDestroy": true,
      "sDom": "&lt;'row-fluid dt-header'&lt;'span6'f&gt;&lt;'span6'T&gt;&gt;t&lt;'row-fluid dt-footer'&lt;'span6'i&gt;&lt;'span6'p&gt;&gt;",
      "oTableTools": {
          "aButtons": ["xls", "pdf", "print"],
          "sSwfPath": "../Content/media/swf/copy_csv_xls_pdf.swf"
      },
      "aaData": statisticsModel.byCategoriesList(),
      "aaSorting": [[0, "desc"]],
      "bPaginate": false,
      "aoColumns": [
          { "mDataProp": "CategoryName", "sTitle": "Reports.CategoryName" },
          { "mDataProp": "AverageTime", "sTitle": "Reports.AverageTime", "sSortDataType": "duration-desc"},
          { "mDataProp": "NumberOfProblemsSolved", "sTitle": "Reports.NumberOfProblemsSolved" }
      ],
      "oLanguage": MeridianTranslation.DataTable
  
  });
  </code></pre>
  
  <p>Here is what <strong>I ASSUME</strong> to be the proper way to add a new sort function and a new sSortType into my table:</p>
  
  <pre><code>jQuery.extend(jQuery.fn.dataTableExt.oSort['duration-desc'] = function (x, y) {
      var xHours = parseInt(x.slice(0, x.indexOf(':')));
      var xMinutes = parseInt(x.slice(x.indexOf(':') + 1, x.length)) + xHours * 60;
      var yHours = parseInt(y.slice(0, y.indexOf(':')));
      var yMinutes = parseInt(y.slice(y.indexOf(':') + 1, y.length)) + yHours * 60;
      return ((xMinutes &lt; yMinutes) ? -1 : ((xMinutes &gt; yMinutes) ? 1 : 0));
  });
  
  jQuery.extend(jQuery.fn.dataTableExt.oSort['duration-asc'] = function (x, y) {
      var xHours = parseInt(x.slice(0, x.indexOf(':')));
      var xMinutes = parseInt(x.slice(x.indexOf(':')+1, x.length)) + xHours * 60;
      var yHours = parseInt(y.slice(0, y.indexOf(':')));
      var yMinutes = parseInt(y.slice(y.indexOf(':')+1, y.length)) + yHours * 60;
      return ((xMinutes &lt; yMinutes) ? 1 : ((xMinutes &gt; yMinutes) ? -1 : 0));
  });
  </code></pre>
  
  <p>I suppose there is a much better way for extracting the number of minutes than the way I do it, but let's suppose my algorithm is valid. What must I do to initialize my dataTable properly and integrate this sort function and data type into it? The table itself renders properly, but when I try to sort the column in question, it sort itself lexicographically, as if it were a string.
  Any ideas?</p>