无法对具有前导零ListJS的小数进行排序

Question

我使用List.js (v1.5.0)在表上添加排序，无法让我的十进制值正确排序。十进制值按“标准排序”排序，而不是“自然顺序排序”。按"EC AVG“对下表进行排序会产生不正确的排序。它似乎无法识别小数点后的前导零。

​

以下是HTML表的一个片段：

<div id="sort-me" class="tableFixHead">
  <table class="table mdl-shadow--4dp" id="myTable" >
    <thead>
      <tr>
        <th class="sort" data-sort="unit_name">Unit Name</th>
        <th class="sort" data-sort="ec_average">EC Avg</th>
        <th class="sort" data-sort="ph_average">pH Avg</th>
        <th class="sort" data-sort="ec_min">EC Min</th>
        <th class="sort" data-sort="ec_max">EC Max</th>
        <th class="sort" data-sort="ph_min">pH Min</th>
        <th class="sort" data-sort="ph_max">pH Max</th>
      </tr>
    </thead>
    <tbody class="list">
     <tr>
      <td class="unit_name">Fake Unit 1</td>
      <td class="ec_average" >0.01</td>
      <td class="ph_average" >6.26</td>
      <td class="ec_min" >0.01</td>
      <td class="ec_max" >0.01</td>
      <td class="ph_min" >6.14</td>
      <td class="ph_max" >6.38</td>  
     </tr>
     <tr>
      <td class="unit_name">Fake Unit 2</td>
      <td class="ec_average" >0.3</td>
      <td class="ph_average" >6.41</td>
      <td class="ec_min" >0.3</td>
      <td class="ec_max" >0.01</td>
      <td class="ph_min" >5.68</td>
      <td class="ph_max" >6.44</td>  
     </tr>
     <tr>
      <td class="unit_name">Fake Unit 3</td>
      <td class="ec_average" >0.03</td>
      <td class="ph_average" >6.13</td>
      <td class="ec_min" >0.01</td>
      <td class="ec_max" >0.05</td>
      <td class="ph_min" >5.62</td>
      <td class="ph_max" >6.33</td>  
     </tr>
     <tr>
      <td class="unit_name">Fake Unit 4</td>
      <td class="ec_average" >0.5</td>
      <td class="ph_average" >4.81</td>
      <td class="ec_min" >0.3</td>
      <td class="ec_max" >0.55</td>
      <td class="ph_min" >5.68</td>
      <td class="ph_max" >6.24</td>  
     </tr>
     <tr>
      <td class="unit_name">Fake Unit 5</td>
      <td class="ec_average" >0.05</td>
      <td class="ph_average" >4.93</td>
      <td class="ec_min" >0.01</td>
      <td class="ec_max" >0.07</td>
      <td class="ph_min" >5.64</td>
      <td class="ph_max" >6.13</td>  
     </tr>
    </tbody>
  </table>
</div>

以及以下List.js选项和初始化器：

var sorting_options = {
  valueNames: ['unit_name', 'ec_average', 'ec_min', 'ec_max', 'ph_average', 'ph_min', 'ph_max']
};

var statusList = new List('sort-me', sorting_options);

我的用例似乎是一个非常标准的排序问题，所以我觉得我可能只是遗漏了一些在文档中很难追踪到的东西。

你知道为什么用List.js对小数进行排序似乎不起作用吗？

Answer 1

这似乎是List.js (https://github.com/nwoltman/string-natural-compare)使用的排序方法的预期行为。

该排序算法实际上并不将每个字符串视为一个小数，而是将小数点视为一个句点，并对小数点后面的内容进行排序，就好像它们是用零填充的整数一样。

您将不得不为List.js提供您自己的排序函数。每个the List.js docs

如果您想使用自己的、read the code和check out the tests，可以在https://github.com/nwoltman/string-natural-compare中找到默认的排序函数。

这不是很有帮助，但就是这样。浏览一下代码，看起来像是将一个sortFunction属性传递给构造函数的第二个参数就可以了。

更新：我找到了相关的测试。Note the "a bit wrong" in the test description.