Topic: DataTables sort by numeric value and not string value
jasinskimathieu pro asked 2 years ago
Hello,
I want to sort numeric value with html method, but it doesn't work. But, if I do the same with JS, it is word. Why ?
I use Datatables in HTML like this :
<div class="datatable">
<table>
<thead>
<tr>
<th class="th-sm">Name</th>
<th class="th-sm">Position</th>
<th class="th-sm">Office</th>
<th class="th-sm">Age</th>
<th class="th-sm">Start date</th>
<th class="th-sm">Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>6</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>22</td>
<td>2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>5</td>
<td>2010/10/14</td>
<td>$327,900</td>
</tr>
</tbody>
</table>
</div>
and if I try with JS, I have correct sort
<script type="text/javascript">
const basicData = {
columns: ['Name', 'Position', 'Office', 'Age', 'Start date', 'Salary'],
rows: [
["Tiger Nixon", "System Architect", "Edinburgh", 61, "2011/04/25", "$320,800"],
["Ashton Cox", "Junior Technical Author", "San Francisco", 6, "2009/01/12", "$86,000"],
["Cedric Kelly", "Senior Javascript Developer", "Edinburgh", 22, "2012/03/29", "$433,060"],
["Rhona Davidson", "Integration Specialist", "Tokyo", 5, "2010/10/14", "$327,900"],
],
};
new mdb.Datatable(document.getElementById('datatable'), basicData)
</script>
Grzegorz Bujański staff answered 2 years ago
This is due to the fact that in HTML all texts are always of type string. Even if you pass number or date it will be of type string. Look at this snippet: https://mdbootstrap.com/snippets/standard/grzegorz-bujanski/4619543#js-tab-view
Regardless of whether this data is provided - by HTML or added via JS, after checking the data type in HTML code, it will always be a string.
In datatables we do not change data types and it is also not possible to provide information about what type of data it is. Therefore, if you add data using HTML, for our datatable component all this data is a string. If you want to pass data of a type other than string, you have to pass it using JS.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 6.0.1
- Device: Pc
- Browser: Firefox
- OS: wINDOWS
- Provided sample code: No
- Provided link: No