我正在使用excel-bootstrap-table-filter jQuery 插件在我的网站上对表格进行排序。 它的效果非常好,但是当涉及到日期字段的排序时就出现了问题。 我的日期格式为DD MMM YYYY
。
excel-bootstrap-table-filter根据DD
值对表格进行排序。 有没有人知道如何让插件正确地排序日期?
我正在使用excel-bootstrap-table-filter jQuery 插件在我的网站上对表格进行排序。 它的效果非常好,但是当涉及到日期字段的排序时就出现了问题。 我的日期格式为DD MMM YYYY
。
excel-bootstrap-table-filter根据DD
值对表格进行排序。 有没有人知道如何让插件正确地排序日期?
由于您正在使用此插件,所以没有实现日期
过滤器。 您需要将FilterCollection.prototype.sort
函数替换为以下代码
FilterCollection.prototype.sort = function(column, order, table, options) {
var flip = 1;
if (order === options.captions.z_to_a.toLowerCase().split(' ').join('-')) flip = -1;
var tbody = $(table).find('tbody').get(0);
var rows = $(tbody).find('tr').get();
var th = $(table).find('th')[column];
var isType = th.getAttribute('istype');
var dateformat = th.getAttribute('dateformat');
rows.sort(function(a, b) {
var A = a.children[column].innerText.toUpperCase();
var B = b.children[column].innerText.toUpperCase();
if (isType == 'date') {
A = moment(A, dateformat);
B = moment(B, dateformat);
return A.diff(B, 'd') * flip;
} else if (!isNaN(Number(A)) && !isNaN(Number(B))) {
if (Number(A) < Number(B)) return -1 * flip;
if (Number(A) > Number(B)) return 1 * flip;
} else {
if (A < B) return -1 * flip;
if (A > B) return 1 * flip;
}
return 0;
});
for (var i = 0; i < rows.length; i++) {
tbody.appendChild(rows[i]);
}
};
moment.js
。希望这能帮助/指导您实现您的需求。
表格代码
<table id="table" class="table table-bordered table-intel">
<thead>
<tr>
<th class="filter">Animal</th>
<th class="filter">Class</th>
<th class="filter">Collective Noun</th>
<th dateformat="DD MM YYYY" isType="date" class="filter">Date</th>
</tr>
</thead>
<tbody>
<tr>
<td>Bear</td>
<td>Mammal</td>
<td>Sleuth</td>
<td>11 04 2018</td>
</tr>
<tr>
<td>Ant</td>
<td>Insect</td>
<td>Army</td>
<td>11 05 2018</td>
</tr>
<tr>
<td>Salamander</td>
<td>Amphibian</td>
<td>Congress</td>
<td>11 04 2018</td>
</tr>
<tr>
<td>Owl</td>
<td>Bird</td>
<td>Parliament</td>
<td>10 04 2018</td>
</tr>
<tr>
<td>Frog</td>
<td>Amphibian</td>
<td>Army</td>
<td>1 04 2018</td>
</tr>
<tr>
<td>Shark</td>
<td>Fish</td>
<td>Gam</td>
<td>11 04 2018</td>
</tr>
<tr>
<td>Kookaburra</td>
<td>Bird</td>
<td>Cackle</td>
<td>21 04 2018</td>
</tr>
<tr>
<td>Crow</td>
<td>Bird</td>
<td>Murder</td>
<td>23 04 2018</td>
</tr>
<tr>
<td>Elephant</td>
<td>Mammal</td>
<td>Herd</td>
<td>11 03 2018</td>
</tr>
<tr>
<td>Barracude</td>
<td>Fish</td>
<td>Grist</td>
<td>30 04 2018</td>
</tr>
</tbody>
</table>