Primefaces tabview tabChange 显示选项卡后触发的事件

问题描述

我正在使用 Primefaces 3.5 &JSF2.1 (Mojarra)

I am working on a project using Primefaces 3.5 & JSF2.1 (Mojarra)

我创建了一个 primefaces <p:tabView id="tabsVw" dynamic="false"> 里面有两个选项卡，每个选项卡都有一个 primefaces 数据表

I have created a primefaces <p:tabView id="tabsVw" dynamic="false"> with two tabs inside and each tab has a primefaces datatable

 <h:form> 
        <p:tabView  dynamic="false">
        <p:ajax event="tabChange" listener="#{tstTab.onDtlTabChanged}" />

            <p:tab title="tab1">
                <p:dataTable value="#{tstTab.list1}" var="v1">
                    <p:column>
                        <h:outputText value="#{v1}"/>
                    </p:column>
                </p:dataTable>
            </p:tab>

            <p:tab title="tab2">
                <p:dataTable value="#{tstTab.list2}" var="v2">
                    <p:column>
                        <h:outputText value="#{v2}"/>
                    </p:column>
                </p:dataTable>          
            </p:tab>
        </p:tabView>
    </h:form>

在 bean 内部(查看范围)

and inside the bean (view scoped)

@ManagedBean
@ViewScoped
public class TstTab {

    private List<String> list1;
    private List<String> list2;

    public TstTab(){
        list1 = new ArrayList<String>();
        list2 = new ArrayList<String>();


        list1.add("List 1 - Str 1");
        list1.add("List 1 - Str 2");
        list1.add("List 1 - Str 3");
        list1.add("List 1 - Str 4");
        list1.add("List 1 - Str 5");

        list2.add("List 2 - Str 1");
        list2.add("List 2 - Str 2");
        list2.add("List 2 - Str 3");
        list2.add("List 2 - Str 4");
        list2.add("List 2 - Str 5");            
    }


    public void onDtlTabChanged(TabChangeEvent event) {
        System.out.println("000000000000000000");
    }


    public List<String> getList1() {
        System.out.println("11111111111111");
        return list1;
    }


    public List<String> getList2() {
        System.out.println("222222222222222222");
        return list2;
    }

}

现在的问题是当运行应用程序并尝试在选项卡之间导航(更改)时，但我可以看到在调用 getter 之后调用了 onDtlTabChanged，所以这是一个大问题.

now the problem is when run the application and try to navigate (change) between tabs, but I can see that the onDtlTabChanged is called after calling getters, so that is a big problem.

如果将 tabView 从静态更改为动态，则行为是随机的，换句话说，更改事件的调用发生在 getter 中间的某个地方.

and if change the tabView from static to dynamic, then the behavior is random, in other words the calling to the change event is happening somewhere in the middle of getters.

提前谢谢你.

推荐答案

嗯，我认为是primefaces的BUG，我找到了一个解决方法，如下所示

Well I think that its a primefaces BUG, I found a workaround which as the following

不要使用全局表单(tabView 本身的表单)而是为每个选项卡使用一个表单(在它内部围绕数据表)

Do not use a global form (form for the tabView itself) instead use a form for each tab (inside it that surround the datatable)

您必须添加一个虚拟选项卡作为第一个必须包含其中一些静态数据或预加载数据的表单

You have to add a dummy tab to be the first one that must include a form which some static data or pre-loaded data inside

就是这样，

问题是 ajax 请求在全局表单内，它导致数据表在 ajax 请求之前首先获取它们的数据，Primefaces 的奇怪之处在于，如果您不添加第一个虚拟选项卡，它将始终执行选项卡内的第一个表单并获取其数据，这将导致问题

the problem was that the ajax request is inside the global form and it cause the datatables to get their data first before ajax request, the strange thing with Primefaces that if you do not add the first dummy tab it will always execute the first form inside the tabs and get its data and this will cause a problem

问候，