ID 表的引导表数字排序

问题描述 投票:0回答:1

我正在使用 Boostrap 表来描述管理页面中数据库中的表。我将一个数组保存到 json 文件中,然后进入表格并使用以下代码显示它:

<div class=\"row\">
        <div class=\"col-lg-12\">
            <div class=\"panel panel-default\">
                <div class=\"panel-heading\"> <a href='record_show.php?tselect=blog&typerec=newblog' class='btn btn-success'>Добавить запись</a></div>
                
         <table data-toggle=\"table\" data-url=\"tables/data4.json\"  data-sort-name=\"id\" data-sort-order=\"desc\" data-show-refresh=\"true\" data-show-toggle=\"true\" data-show-columns=\"true\" data-search=\"true\" data-select-item-name=\"toolbar1\" data-pagination=\"true\" >

                        <thead>
                        <tr>
                            <th data-field=\"id\" data-sortable=\"true\">ID</th>
                            <th data-field=\"header\" data-sortable=\"true\" >Заголовок</th>
                            <th data-field=\"intro\" data-sortable=\"true\" >Введение</th>
                            <th data-field=\"status\" data-sortable=\"true\" >Статус</th>
                            <th data-field=\"seo\" data-sortable=\"true\" >Сео</th>
                            <th data-field=\"type\" data-sortable=\"true\" >Тип</th>
                            <th data-field=\"date\" data-sortable=\"true\" >Дата</th>
                                                            
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>

问题是 Bootstrap 表仅按字母数字排序,即 (1,11,12,2,21,3) 等。您是否有过将 Bootstrap 表强制为数字排序的经验,即(1,2,3, 11,12,21)?

javascript bootstrap-4 bootstrap-table
1个回答
2
投票

在最新版本的 Bootstrap 表中,我发现了以下内容。

你可以使用

data-custom-sort="customSort"

然后您需要将以下脚本放在所用表格的 HTML 正下方。

function customSort(sortName, sortOrder, data) {
    var order = sortOrder === 'desc' ? -1 : 1
    data.sort(function (a, b) {
        var aa = +((a[sortName] + '').replace(/[^\d]/g, ''))
        var bb = +((b[sortName] + '').replace(/[^\d]/g, ''))
        if (aa < bb) {
            return order * -1
        }
        if (aa > bb) {
            return order
        }
        return 0
    })
}
© www.soinside.com 2019 - 2024. All rights reserved.