如何以编程方式重新排序primefaces数据表中的列

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

我有一个10列的数据表,以4:4:2的方式分组。现在,前两个组(4个)是固定的,而最后2个组可以根据条件添加到任何组(一次或两个)。有没有办法为列设置索引,以便可以根据条件对它们进行排序?我看到Primefaces使用drag n drop重新排序给出了我要查找的结果类型,除了我希望重新排序在表格显示之前可编程和设置。

primefaces jsf-2 datatable
1个回答
1
投票

我有基本相同的问题:允许用户重新排列列后,很容易将安排保存到cookie中,但如何在一天后恢复订单?

据我所知,没有这方面的方法,但可以用一点点javascript攻击。 (我试过使用primefaces 6.0)

1)为所有列赋予唯一的styleClasses,如:

styleClass="mystyle col0"
styleClass="mystyle col1"
styleClass="mystyle col2"
...

2)将styleClass字符串转换为有效的css选择器,并将所需的列顺序存储为这些列的顺序,如:

".mystyle.col2,.mystyle.col0,.mystyle.col1"

把它放进一个饼干,或者存储并随意取回。

3)编写一个javascript函数,将单元格重新排列为所需的顺序:

function reorder() {              
    var o = getCookie('orderString');            
    var a = o.split(",");
    for (var i = a.length - 1; i >= 0; i--) {                 
        $(a[i]).each(function() {
            $(this).prependTo($(this).parent())
        });
    }
}

function getCookie(name) {
    var value = "; " + document.cookie;
    var parts = value.split("; " + name + "=");
    if (parts.length === 2)
        return parts.pop().split(";").shift();
}

(不要使用EL表达式从支持bean中取回订单字符串,因为它会对页面呈现进行评估,因此如果用户再次重新排列列,则不会更新。)

4)每次需要时执行重新排序()“。

你肯定会在页面加载时需要它:

$(document).ready(function() {
    reorder();
});

而且还有分页事件,所以添加这样的东西:

<p:ajax event="page" oncomplete="reorder();" />

(也许有些时候我还没见过。)

© www.soinside.com 2019 - 2024. All rights reserved.