【问题标题】:Primefaces 3.3/3.4 tabview: ajax update on tabChangePrimefaces 3.3/3.4 tabview:tabChange 上的 ajax 更新
【发布时间】:2013-05-07 07:02:25
【问题描述】:

使用以下代码,两个选项卡的内容在 tabChange 事件中被清除,而不是被更新:

<h:form id="form">
    <p:tabView id="tabview">
        <p:ajax event="tabChange" listener="#{testBean.onChange}" update="@form"/>
        <p:tab title="Tab 1">
            <h:outputText value="Lorem ipsum dolor sit amet." id="ht1"/>
        </p:tab>
        <p:tab title="Tab 2">
            <h:outputText value="Donec et mi et arcu commodo hendrerit." id="ht2"/>
        </p:tab>
    </p:tabView>
</h:form>

onChange方法是空方法是我的测试代码。

我在这里遗漏了一些东西,但我找不到什么。我究竟做错了什么?

编辑

我正在使用 ViewScoped bean。

我试过update="@form"update=":form"update=":form:tabview",出现同样的问题。

如果我使用update="ht1, ht2",一切都很好但是在我的 onChange 方法中,我想以编程方式选择我想要激活的选项卡(在我的真实代码中有一个验证一些数据:如果验证失败,我想留在标签 1,如果没问题,转到标签 2)。为此,我想我必须更新整个 tabview 组件,而不仅仅是标签的内容。但也许我错了?

完整代码

我做了一些更改,这是我的更新代码,但仍然无法正常工作。

托管 bean:

import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import org.primefaces.event.TabChangeEvent;

@ManagedBean
@ViewScoped
public class TestBean implements Serializable {

    private int idx;
    private String s1 = "test 1";
    private String s2 = "test 2";

    public TestBean() {
        System.out.println("TestBean.init");
    }

    public void onChange(TabChangeEvent e){
        s1 = "TEST TEST";
        s2 = "TEST TEST";
    }

    public int getIdx() {
        return idx;
    }

    public void setIdx(int idx) {
        this.idx = idx;
    }

    public String getS1() {
        return s1;
    }

    public void setS1(String s1) {
        this.s1 = s1;
    }

    public String getS2() {
        return s2;
    }

    public void setS2(String s2) {
        this.s2 = s2;
    }
}

小脸:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        <h:form id="form">
            <p:tabView id="tabview" activeIndex="#{testBean.idx}">
                <p:ajax event="tabChange" listener="#{testBean.onChange}" update="@form"/>
                <p:tab title="Tab 1">
                    <h:outputText value="#{testBean.s1}" id="ht1"/>
                </p:tab>
                <p:tab title="Tab 2">
                    <h:outputText value="#{testBean.s2}" id="ht2"/>
                </p:tab>
            </p:tabView>
            <h:messages/>
        </h:form>
    </h:body>
</html>

更新

我将 Primefaces jar 从 3.4 更改为 3.2 和魔术,这种行为不再发生。然后我尝试了 3.3 和繁荣,错误。我将在 Primefaces 论坛上询问这是否是一个已知错误。

【问题讨论】:

  • 你想做什么,你想达到什么目标?
  • @roel 在更改当前选项卡后,他想调用一些逻辑,很明显......?
  • 我以前在这种 Primefaces 对象上遇到过update="@form" 的一些问题。您可以尝试在此处引用id(不确定它是否能解决您的问题)。
  • @roel 正如 Aquillo 所说,我的真实代码中有一些逻辑在 onChange 方法中调用。 Aquillo:我尝试引用一个 id,但出现了同样的问题。不过谢谢
  • 好吧,你能告诉我们你想做什么逻辑吗?也许有问题?

标签: ajax jsf-2 primefaces


【解决方案1】:

你应该使用activeIndex

 <p:tabView id="tabview" activeIndex="#{testBean.tabIndex}" >

在你的 onchange 方法中,验证后设置正确的 tabindex。

【讨论】:

  • 这确实是以编程方式设置活动选项卡的正确方法,谢谢,经过测试和批准。
  • 不,这不是正确的方法,但它肯定被复制到整个互联网......为什么要绑定activeIndex,然后在tabChange 监听器中手动编辑它的值?当你绑定它时,你已经在告诉 PrimeFaces 读/写它。发布另一个答案。
【解决方案2】:

绑定activeIndex 属性是不够的。您还必须触发 AJAX 提交以更新服务器上的值。所以应该是:

<p:tabView activeIndex="#{bean.index}">
    <p:ajax event="tabChange" />
</p:tabView>

【讨论】:

猜你喜欢
  • 1970-01-01
  • 2011-12-17
  • 1970-01-01
  • 1970-01-01
  • 2023-03-22
  • 1970-01-01
  • 2014-06-11
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多