DataTables

DataTables Examples

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/v/dt/dt-1.10.21/datatables.min.css">
<script src="https://cdn.datatables.net/v/dt/dt-1.10.21/datatables.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
<table id="table">
    <thead>
    <th>Range</th>
    </thead>

</table>

JavaScript

(function (factory) {
	if (typeof define === "function" && define.amd) {
		define(["jquery", "moment", "datatables.net"], factory);
	} else {
		factory(jQuery, moment);
	}
}(function ($, moment) {

$.fn.dataTable.moment = function ( format, locale, reverseEmpties ) {
	var types = $.fn.dataTable.ext.type;
	// Add type detection
	types.detect.unshift( function ( d ) {
		if ( d ) {
    console.log('type detection', d)
			// Strip HTML tags and newline characters if possible
			if ( d.replace ) {
				d = d.replace(/(<.*?>)|(\r?\n|\r)/g, '');
			}

			// Strip out surrounding white space
			d = $.trim( d );
		}
		// Null and empty values are acceptable
		if ( d === '' || d === null ) {
			return 'moment-'+format;
		}

		return moment( d, format, locale, true ).isValid() ?
			'moment-'+format :
			null;
	} );

	// Add sorting method - use an integer for the sorting
	types.order[ 'moment-'+format+'-pre' ] = function ( d ) {
		if ( d ) {
			// Strip HTML tags and newline characters if possible
			if ( d.replace ) {
				d = d.replace(/(<.*?>)|(\r?\n|\r)/g, '');
			}

			// Strip out surrounding white space
			d = $.trim( d );
		}
		
		return !moment(d, format, locale, true).isValid() ?
			(reverseEmpties ? -Infinity : Infinity) :
			parseInt( moment( d, format, locale, true ).format( 'x' ), 10 );
	};
};

}));

var data = [
	['30.04.2020 22:00-23:00'],
	['30.04.2020 23:00-00:00'],
	['01.05.2020 00:00-01:00'],
	['01.05.2020 01:00-02:00'],
]
$.fn.dataTable.moment('DD.MM.YYYY HH:mm');
$('#table').dataTable({
data: data,
	columnDefs: [
  	{
      targets: 0,
    	render: function (data, type, row) {
      console.log('render type', type)
      	if (type === 'sort') {
          console.log(moment(data, 'DD.MM.YYYY HH:mm-ss:ss').format('DD.MM.YYYY HH:mm'))
        	return moment(data, 'DD.MM.YYYY HH:mm-ss:ss').format('DD.MM.YYYY HH:mm')
        }
        return data;
      }
    }
  ]
});