【问题标题】:How to update only active tab of p:tabView?如何仅更新 p:tabView 的活动选项卡?
【发布时间】:2012-12-23 13:20:49
【问题描述】:

我需要在执行操作后刷新 p:tabView(以显示错误消息等)。

要验证的字段位于不同的选项卡上。当我更新整个 tabView 时,这当然是错误的行为,因为在 PrimeFaces 中不可见的选项卡不应该被更新(因为编辑字段是不可见的,并且当它们被刷新时,它们会丢失它们的值,例如 p:autoComplete 是无效)。

所以,我应该只更新活动选项卡,但是如何使用 commandButton 的更新属性只针对活动选项卡,而不是整个 p:tabView?

【问题讨论】:

    标签: jsf jsf-2 tabs primefaces refresh


    【解决方案1】:

    我做了一个简短的例子:

    <h:form id="form">
        <p:tabView id="tabview">
            <p:tab title="tab 1">
                <p:commandButton value="update" update="@parent" />
            </p:tab>
            <p:tab title="tab 2">
                <p:outputPanel id="tab2">
                    <p:commandButton value="update" update=":form:tabview:tab2" />
                </p:outputPanel>
            </p:tab>
        </p:tabView>
    </h:form>
    

    但是,当我通过 ID 或使用 @parent 更新 p:tab 时(就像我在选项卡 1 中所做的那样),选项卡 (div) 被删除了,奇怪...一种解决方法是包装选项卡的内容在一个容器中,就像我在标签 2 中所做的那样。


    哈!找到不能直接更新标签的原因:https://code.google.com/p/primefaces/issues/detail?id=3518

    tabview 外的按钮示例:

    <h:form id="form">
        <p:tabView id="tabview" binding="#{tabView}">
            <p:ajax event="tabChange" update=":form:button" />
            <p:tab title="tab 1">
                <p:outputPanel id="tab0">
                    <p:panel>text</p:panel>
                </p:outputPanel>
            </p:tab>
            <p:tab title="tab 2">
                <p:outputPanel id="tab1">
                    <p:panel>text</p:panel>
                </p:outputPanel>
            </p:tab>
        </p:tabView>
        <p:commandButton id="button" value="update"
            update=":form:tabview:tab#{tabView.activeIndex}" />
    </h:form>
    

    【讨论】:

    • 但是我没有写按钮在标签里面,它们不在我的情况下。
    • 并且更新整个tabView会导致不可见选项卡中的值被重置为null
    • @lechlukasz 使用 tabview 外的按钮查看更新 ;-)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-04-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-07-21
    相关资源
    最近更新 更多