Question

我有一个像这样构建的treegrid：

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Type</th>
            <th>Number</th>
        </tr>
    </thead>
    <tbody>
        <tr class="treegrid-0">
            <th>name2</th>
            <th>type2</th>
            <th>Number2</th>
        </tr>
        <tr class="treegrid-1">
            <th>name1</th>
            <th>type1</th>
            <th>Number1</th>
        </tr>
        <tr class="treegrid-2 treegrid-parent-1" style="display:none;">
            <th>name1-A</th>
            <th>type1-A</th>
            <th>Number1-A</th>
        </tr>
        <tr class="treegrid-3 treegrid-parent-1" style="display:none;">
            <th>name1-B</th>
            <th>type1-B</th>
            <th>Number1-B</th>
        </tr>
        <tr class="treegrid-4">
            <th>name0</th>
            <th>type0</th>
            <th>Number0</th>
        </tr>
    </tbody>
</table>

我想在点击列时添加排序选项。排序选项必须仅在顶级父级上完成。它是一个treegrid，所以预期的行为是，如果父节点必须移动，子节点也必须与父节点一起移动。

我怎么能用JS做到这一点？

Answer 1

而不是自己做所有艰苦的工作，你可以使用awesome js / jQuery库：datatables：https://datatables.net/

在定义你的表之后，给它一个ID

<table id = "myTable">..</table>

然后添加以下代码段，将您的表转换为一个非常棒的表。

$(document).ready(function(){
    $('#myTable').DataTable();
});

干杯！

在treegrid html上添加列排序功能

1 个答案: