JSFiddle - React, Tailwind, and code Playground

by patchlab

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/v/dt/dt-1.10.16/datatables.min.css">
<script src="https://cdn.datatables.net/v/dt/dt-1.10.16/datatables.min.js"></script>
<!DOCTYPE html>
<html lang="de">
<head>
	

</head>
<body>
<table id="table" class="dataTable no-footer" role="grid"><thead><tr>
<th class="sorting_asc" tabindex="0" aria-controls="table" rowspan="1" colspan="1" aria-label="Preis: activate to sort column descending" aria-sort="ascending">Preis</th></tr></thead>
<tbody>
<tr role="row" class="odd">
<td class="sorting_1">

<div class="current-price  sale-price-higher">723,02 €

</div><div></div></td></tr>

<tr role="row" class="even">
<td class="sorting_1">

<div class="current-price  sale-price-higher">623,02 €

</div><div></div></td></tr>

<tr role="row" class="odd">
<td class="sorting_1">

<div class="current-price  sale-price-higher">1.723,02 €

</div><div></div></td></tr>

<tr role="row" class="even">
<td class="sorting_1">

<div class="current-price  sale-price-higher">2.623,02 €

</div><div></div></td></tr>

<tr role="row" class="odd">
<td class="sorting_1">

<div class="current-price  sale-price-higher">123,02 €

</div><div></div></td></tr>

<tr role="row" class="even">
<td class="sorting_1">

<div class="current-price  sale-price-higher">223,02 €

</div><div></div></td></tr>

<tr role="row" class="odd">
<td class="sorting_1">

<div class="current-price  sale-price-higher"> NA

</div><div></div></td></tr>

</tbody>






</body>
</html>

JavaScript

$(document).ready(function() {
 $.fn.dataTable.ext.type.order['html-num-fmt-pre'] = function ( data ) {
    var units = data;
	console.log('here');
    if ( $(units).text().replace(/(\r\n\t|\n|\r\t)/gm,"") == "NA" ) {
         
     return 0;
    }
  
};
 
if($("html:lang(en)").length){
decimal = '.';
thousands = ',';
coldef = "{orderable: false, targets:'no-sort'},{ targets: 1, type: 'html-num-fmt' }";
}else{
decimal = ',';
thousands = '.';
coldef = "{orderable: false, targets:'no-sort'},{ targets: 1, type: 'html-num-fmt' }";
}
$('#table').DataTable({
 
"paging": false,
"info": false,
language: {
'decimal': decimal,
'thousands': thousands
},
columnDefs: [coldef]
});
});