DataTablesを使用するテーブルがあります。表は4つの列で構成され、いくつかのテキストといくつかの数字があります。数値列内に数字がない場合、 'null'がtdに表示されます。どのようにしても、数値を正しく並べ替えることができ、より良いソートを行うためにnull値に0または何らかの数値を付けることはできますか?同じ列の数値とテキストを並べ替える方法
リストを並べ替えると、複数の桁がソートされません。したがって、「10」は「3」の前に来ます。また、あなたは1440年に気づくん180
前に、あなたはあなたが並べ替えるにはない、この奇妙なプラグインを伝えクラス各行の"non-numeric"
を、持っている私のhttp://codepen.io/tetonhiker/pen/dOBeqY
$(function() {
$('#dataTable').DataTable({
"paging": false,
"info": false
});
});
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.13/css/jquery.dataTables.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://code.getmdl.io/1.3.0/material.min.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.js"></script>
<table id="dataTable" class="mdl-data-table mdl-js-data-table mdl-shadow--2dp dataTable">
<thead>
<tr role="row">
<th class="mdl-data-table__cell--non-numeric">Shape Name</th>
<th class="numeric-cell">Number Edges</th>
<th class="numeric-cell">Sum of Interior Angles</th>
<th class="mdl-data-table__cell--non-numeric">Deleted?</th>
</tr>
</thead>
<tbody>
<tr class="rowEditData odd" value="7924" role="row" title="">
<td class="mdl-data-table__cell--non-numeric">Hexagon</td>
<td class="numeric-cell">6</td>
<td class="numeric-cell">null</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData odd deleted" value="7930" role="row" title="">
<td class="mdl-data-table__cell--non-numeric">null</td>
<td class="numeric-cell">3</td>
<td class="numeric-cell">180</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData even" value="7931" role="row">
<td class="mdl-data-table__cell--non-numeric">null</td>
<td class="numeric-cell">4</td>
<td class="numeric-cell">360</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData odd" value="7932" role="row" title="">
<td class="mdl-data-table__cell--non-numeric">null</td>
<td class="numeric-cell">5</td>
<td class="numeric-cell">540</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData even" value="7933" role="row">
<td class="mdl-data-table__cell--non-numeric">null</td>
<td class="numeric-cell">6</td>
<td class="numeric-cell">120</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData odd" value="7934" role="row">
<td class="mdl-data-table__cell--non-numeric">null hello</td>
<td class="numeric-cell">10</td>
<td class="numeric-cell">1440</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData even" value="7925" role="row">
<td class="mdl-data-table__cell--non-numeric">Octagon sample</td>
<td class="numeric-cell">8</td>
<td class="numeric-cell">null</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData odd" value="7922" role="row">
<td class="mdl-data-table__cell--non-numeric">pentagon</td>
<td class="numeric-cell">null</td>
<td class="numeric-cell">null</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData even deleted" value="7926" role="row">
<td class="mdl-data-table__cell--non-numeric">Pentagon</td>
<td class="numeric-cell">null</td>
<td class="numeric-cell">null</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData odd" value="7920" role="row">
<td class="mdl-data-table__cell--non-numeric">square-test</td>
<td class="numeric-cell">4</td>
<td class="numeric-cell">null</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
<tr class="rowEditData even" value="7927" role="row">
<td class="mdl-data-table__cell--non-numeric">Square</td>
<td class="numeric-cell">null</td>
<td class="numeric-cell">null</td>
<td class="mdl-data-table__cell--non-numeric">No</td>
</tr>
</tbody>
</table>
ありがとう!私はこれを全く見つけることができませんでした。それは完全に動作します! – JBaldwin