使用空白单元格以编程方式排序

如何解决使用空白单元格以编程方式排序

我正在通过 setSort 函数使用多列对表格进行排序，该函数在下拉框更改时调用。在下面的代码中，病房列包含一些空值。

patientTable.setSort([
    { column: 'name',dir: 'asc' },{ column: 'ward',dir: 'asc' }
])

问题是在升序排序时，所有空值都出现在列表的顶部。我知道您可以使用 alignEmptyValues 在使用内置分拣器之一强制将空单元格移到底部时使用。使用 setSort 函数时有没有办法做到这一点？我在文档中找不到任何内容，向对象添加 alignEmptyValues 似乎没有任何作用。

我在 Edge 中使用 Tabulator 4.9.3 版

解决方法

您所要做的就是在列定义中设置 alignEmptyValues，然后当您通过单击列标题或以编程方式使用 setSort 进行排序时，它将按照定义移动空值。

var data = [
    {name:"Tom",ward:"A"},{name:"Dick",ward:"B"},{name:"Harry",ward:"C"},{name:"Larry",ward:""},{name:"Moe",{name:"Curly",ward:"C"}
];

var table = new Tabulator("#example-table",{
    data:data,columns:[
        {title:"Name",field:"name"},{title:"Ward",field:"ward",sorter: "string",sorterParams: { alignEmptyValues:"bottom" } },],});

document.getElementById('sort').addEventListener('click',ev => {
    table.setSort([
        { column: 'name',dir: 'asc' },{ column: 'ward',dir: 'asc' }
    ]);
});

<link href="https://unpkg.com/tabulator-tables@4.9.3/dist/css/tabulator.min.css" rel="stylesheet">
<script src="https://unpkg.com/tabulator-tables@4.9.3/dist/js/tabulator.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

<div id="example-table"></div>

<br>
<button id="sort">Set Sort</button>