Question

我有一个包含三列的表：Id，Name和Size

在MVC视图中，我喜欢：

<table class="table table-hover">
    <thead>
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Size</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.Items)
        {
            <tr>
                <td>
                    @item.Id
                </td>
                <td>
                    @item.Name
                </td>
                <td>
                    <span data-sort="@item.SizeVal">
                        @item.Size
                    </span>
                </td>
            </tr>
        }
    </tbody>
</table>

Size看起来像：15 MB或1.25 GB等。

SizeVal属性中的data-sort是一个从MB，GB转换为Bytes的数字。

在javascript中，我初始化了datatable对象

var $fileTable = $(".table");

var dtable = $fileTable.DataTable({
    "columnDefs": [
        { "type": "any-number", targets: 2 }
    ],
    order: [[2, "desc"]],
    //responsive: true,
    stateSave: true,
    pageLength: 25
});

我希望在对Size列进行排序时，应考虑来自data-sort属性的值。

我尝试过

"columnDefs": [
   { "type": "any-number", targets: 2 }
],

但排序不好。

如何实现？

Answer 1

数据表读取当前data-sort中的td。

因此，您无需将其放入跨度中，而是将其放入td中，如此处here的HTML部分所示

<td data-sort="@item.SizeVal">
    @item.Size
</td>

也请阅读documentation进行解释。

在ASP.NET Core中使用自定义html属性对数据表中的列进行排序

1 个答案: