Primefaces 如何使用相同的datatable创建选项卡视图并对其进行分页

我想制作一个带有primefaces组件的tabview，其中有三个选项卡，在选项卡内我将使用带有输入文本的datatable。是否可以在三个选项卡中使用相同的数据表和不同的字段？是否可以同时对所有选项卡分页，以便一次显示相同的寄存器？对不起，我的英语不好

想象一个具有以下属性的对象列表：颜色、形状、车轮、名称、型号和价格

选项卡视图
Tab1 Tab2 Tab3
1行颜色|成型车轮|名称型号|价格
第2行
3排

---

我想使用相同的datatable并同时对三个选项卡进行分页，以便在三个选项卡上具有相同的行。

这是可能的。您可以将事件添加到选项卡视图中。然后更改dataTable列的可见性。 代码可以是这样的：

<p:tabView activeIndex="#{bean.activeTab}">
    <p:ajax event="tabChange" update="@([id$=dataTable])" />

    <p:tab title="Tab1">
    <p:tab title="Tab2">
    <p:tab title="Tab3">
</p:tabView>

<p:dataTable id="dataTable" value="#{bean.cars}">
    <p:column headerText="Colour" rendered="#{bean.activeTab == 0}">
        ...
    </p:column>

    <p:column headerText="Form" rendered="#{bean.activeTab == 0}">
        ...
    </p:column>

    <p:column headerText="Wheels" rendered="#{bean.activeTab == 1}">
        ...
    </p:column>

    <p:column headerText="Name" rendered="#{bean.activeTab == 1}">
        ...
    </p:column>

    <p:column headerText="Model" rendered="#{bean.activeTab == 2}">
        ...
    </p:column>

    <p:column headerText="Price" rendered="#{bean.activeTab == 2}">
        ...
    </p:column>
</p:dataTable>

...
...
...
...
...
...

这是可能的。您可以将事件添加到选项卡视图中。然后更改dataTable列的可见性。 代码可以是这样的：

<p:tabView activeIndex="#{bean.activeTab}">
    <p:ajax event="tabChange" update="@([id$=dataTable])" />

    <p:tab title="Tab1">
    <p:tab title="Tab2">
    <p:tab title="Tab3">
</p:tabView>

<p:dataTable id="dataTable" value="#{bean.cars}">
    <p:column headerText="Colour" rendered="#{bean.activeTab == 0}">
        ...
    </p:column>

    <p:column headerText="Form" rendered="#{bean.activeTab == 0}">
        ...
    </p:column>

    <p:column headerText="Wheels" rendered="#{bean.activeTab == 1}">
        ...
    </p:column>

    <p:column headerText="Name" rendered="#{bean.activeTab == 1}">
        ...
    </p:column>

    <p:column headerText="Model" rendered="#{bean.activeTab == 2}">
        ...
    </p:column>

    <p:column headerText="Price" rendered="#{bean.activeTab == 2}">
        ...
    </p:column>
</p:dataTable>

...
...
...
...
...
...

什么是“相同的数据表和不同的字段”？你的问题不清楚。您的意思是tab1上数据表的分页应该反映在tab2和TAB3的数据表中吗？e、 g.如果您转到表1的第3页，并且转到表3，那么它也在第3页？因为显示同一支持模型的distict字段当然是可能的，因为您可以决定显示什么。“您的意思是tab1上的数据表的分页应该反映在tab2和3的数据表中吗？例如，如果您转到tab1上的第3页，您转到tab3，它也会在第3页上吗？”确切地说。我的意思是所有选项卡都有相同的datatable，我只是在三个选项卡中划分行。在三个选项卡中划分列？；-）然后从这里开始：pdatatable并在与所有datatable共享的属性中设置此“first”变量，并通过ajax在一个datatable中分页时更新其他datatable。什么是“相同的datatable和不同的字段”？你的问题不清楚。您的意思是tab1上数据表的分页应该反映在tab2和TAB3的数据表中吗？e、 g.如果您转到表1的第3页，并且转到表3，那么它也在第3页？因为显示同一支持模型的distict字段当然是可能的，因为您可以决定显示什么。“您的意思是tab1上的数据表的分页应该反映在tab2和3的数据表中吗？例如，如果您转到tab1上的第3页，您转到tab3，它也会在第3页上吗？”确切地说。我的意思是所有选项卡都有相同的datatable，我只是在三个选项卡中划分行。在三个选项卡中划分列？；-）然后从这里开始：pdatatable并在与所有DataTable共享的属性中设置此“first”变量，并通过ajax在一个DataTable中分页时更新其他DataTable。对于这样的解决方案，我认为最好使用tabMenu。如果datatable在选项卡视图之外，则选项卡视图是无用的。但它可以工作。不确定您是否希望一直更新（在这种情况下，您也可以使用javascript在客户端显示/隐藏列。无需每次往返服务器。请记住，OP希望在切换时保持在同一行上，因此滚动仍应保留在内存中，并在切换选项卡后应用。因此，仍然缺少很多内容，但这是一种实现tr的方法。）我认为，对于这样的解决方案，您最好使用tabMenu。如果datatable在tabview之外，则tabview是无用的。但它可以工作。不确定您是否希望一直更新（在这种情况下，您也可以使用javascript在客户端显示/隐藏列。无需每次往返服务器。请记住，OP希望在切换时保持在同一行上，因此滚动仍应保留在内存中，并在切换选项卡后应用。因此，仍然缺少很多内容，但这是一种实现tr的方法。）Y