Jquery 基于请求参数的jsf2 ajax更新部件_Jquery_Ajax_Jsf 2

Jquery 基于请求参数的jsf2 ajax更新部件

jquery ajax jsf-2

Jquery 基于请求参数的jsf2 ajax更新部件,jquery,ajax,jsf-2,Jquery,Ajax,Jsf 2,这个例子有点极端，我想做的并不完全是这个，但是用它来证明我的问题更简单我有一个页面，带有一个简单的index.xhtml： <html xmlns:h="http://java.sun.com/jsf/html" xmlns:mc="http://java.sun.com/jsf/composite/mc"> ... <h:panelGroup id="u1" styleClass="unique_container">

这个例子有点极端，我想做的并不完全是这个，但是用它来证明我的问题更简单

我有一个页面，带有一个简单的index.xhtml：

<html
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:mc="http://java.sun.com/jsf/composite/mc">
    ...
    <h:panelGroup id="u1" styleClass="unique_container">
        <mc:component1></mc:component1>
    </h:panelGroup>
    <h:panelGroup id="u2" styleClass="unique_container">
        <mc:component2></mc:component2>
    </h:panelGroup>
    <h:panelGroup id="u3" styleClass="unique_container">
        <mc:component3></mc:component3>
    </h:panelGroup>
    <form action="/faces/async.xhtml">
        <input type="checkbox" name="renderu1" />
        <input type="checkbox" name="renderu2" />
        <input type="checkbox" name="renderu1" />
        <input type="submit" value="render" />
    </form>
    ...
</html>

因此，例如，如果仅选中第3个复选框，则响应如下：

<html>
    <span id="u3" class="unique_container">
        content of component3
    </span>
</html>


成分3的含量

它工作正常，简单明了，但后来我开始为我的一个组件使用RichFaces——问题是，它使用了jQuery的$（document）.ready（fn）函数，当我用RichFaces重新加载零件时，它会断开（它是一个树组件，我无法打开节点）

我一直在寻找一种工作解决方案，它可以像我的解决方案那样做，但对兼容性问题有更好的准备（从技术上讲，我想根据参数来决定更新哪个部分，所以当呈现原始页面时，我还不知道写什么来“执行”和“呈现”属性）这实际上是一个非常糟糕的解决方案。您可以使用纯JSF2.0解决这个问题，而不需要jQuery、JSTL和自定义标记。您可以使用

触发ajax请求并呈现部分组件。您可以通过JSF组件的

rendered

属性有条件地呈现JSF组件

这里是一个基本的启动示例，假设您正在运行一个支持Servlet 3.0/EL 2.2的容器，其中按照Servlet 3.0规范声明了一个

/WEB-INF/WEB.xml

（否则

.contains（）

在EL中不起作用，您必须编写一个自定义EL函数）


...
第一小组
第二小组
第三小组
...

与

@ManagedBean
@请求范围
公共类Bean{
私人名单小组；
公共列表getPanels（）{
返回面板；
}
公共面板（列表面板）{
这一点。面板=面板；
}
}

就这些

<html xmlns:mc="http://java.sun.com/jsf/composite/mc"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
    <c:if test="#{asyncBean.render1}">
        <h:panelGroup id="u1" styleClass="unique_container">
            <mc:component1></mc:component1>
        </h:panelGroup>
    </c:if>
    <c:if test="#{asyncBean.render2}">
        <h:panelGroup id="u2" styleClass="unique_container">
            <mc:component2></mc:component2>
        </h:panelGroup>
    </c:if>
    <c:if test="#{asyncBean.render3}">
        <h:panelGroup id="u3" styleClass="unique_container">
            <mc:component3></mc:component3>
        </h:panelGroup>
    </c:if>
</html>

@ManagedBean(name="asyncBean")
@RequestScoped
public class AsyncBean {

    @ManagedProperty(value="#{param.renderu1}")
    private boolean render1;

    @ManagedProperty(value="#{param.renderu2}")
    private boolean render2;

    @ManagedProperty(value="#{param.renderu3}")
    private boolean render3;

    private boolean isRender1() {
        return render1;
    }

    private void setRender1(boolean render1) {
        this.render1 = render1;
    }

    private boolean isRender2() {
        return render2;
    }

    private void setRender2(boolean render2) {
        this.render2 = render2;
    }

    private boolean isRender3() {
        return render3;
    }

    private void setRender3(boolean render3) {
        this.render3 = render3;
    }
}

<html>
    <span id="u3" class="unique_container">
        content of component3
    </span>
</html>

<!DOCTYPE html>
<html lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
>
    ...
    <h:panelGroup id="panels">
        <h:panelGroup rendered="#{bean.panels.contains('u1')}">
            panel one
        </h:panelGroup>
        <h:panelGroup rendered="#{bean.panels.contains('u2')}">
            panel two
        </h:panelGroup>
        <h:panelGroup rendered="#{bean.panels.contains('u3')}">
            panel three
        </h:panelGroup>
    </h:panelGroup>

    <h:form>
        <h:selectManyCheckbox value="#{bean.panels}">
            <f:selectItem itemValue="u1" />
            <f:selectItem itemValue="u2" />
            <f:selectItem itemValue="u3" />
            <f:ajax render=":panels" />
        </h:selectManyCheckbox>
    </h:form>
    ...
</html>

@ManagedBean
@RequestScoped
public class Bean {

    private List<String> panels;

    public List<String> getPanels() {
        return panels;
    }

    public void setPanels(List<String> panels) {
        this.panels = panels;
    }

}