jsf2 ajax根据请求参数更新部分

| 这个例子有点极端，我想做的不完全是这个，而是更简单地证明我的问题 我有一个页面，有一个简单的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>
当我按下\“ GO \”按钮时，如果要检查renderu1，则要渲染component1；如果要检查renderu2，则要渲染component2；如果要检查renderu3，则要渲染component3 我目前的解决方案是使用jQuery表单插件的js函数： 
$(document).ready(function(){
    registerForms($(document));
});

function registerForms(rootElement)
{
    rootElement.find(\"form\").submit(function() {
    // submit the form
    $(this).ajaxSubmit(function(data, textStatus) {
        if(textStatus == \"notmodified\")
            return;


        var tempDiv = $(\'<div></div>\');
        tempDiv.css(\"display\", \"none\");
        tempDiv.html(data);
        var newUniqueContainer;
        while((newUniqueContainer = tempDiv.find(\".unique_container:first\")).html() != null)
        {
            var oldUniqueContainer = $(\"#\" + newUniqueContainer.attr(\"id\") + \":first\");
            oldUniqueContainer.empty();
            oldUniqueContainer.html(newUniqueContainer.html());
            registerForms(oldUniqueContainer);
            newUniqueContainer.remove();
        }
        tempDiv.remove();
    });
    // return false to prevent normal browser submit and page navigation
    return false;
    });
}
它的作用是每当我提交表单时，它都会向给定的URL发出ajax请求，等待响应，并且如果有内容（状态代码不是304，因此其不是“未修改”），它将获取数据，并将原始\“ unique_containers \”中的内容替换为新数据 async.xhtml： 
<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>
AsyncBean.java： 
@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>
它的工作正常，简单易用，但是后来我开始对我的组件之一使用RichFaces-问题是，它使用jQuery的$（document）.ready（fn）函数，以及当我重新加载零件时使用RichFaces，它会中断（它是树组件，并且我无法打开节点） 我一直在寻找一种可以解决我的问题的解决方案，但是为兼容性问题做好了更好的准备（从技术上讲，我想根据参数决定要更新的部分，因此当呈现原始页面时，我还不知道写入“执行”和“渲染”属性的内容
2020-06-12 2 条评论
分享

没有找到相关结果

    已邀请:

    河饶办斜施

    这实际上是一个非常糟糕的解决方案。您可以使用纯JSF 2.0解决此问题，而无需jQuery，JSTL和自定义标签。您可以使用ѭ5触发ajax请求并渲染部分组件。您可以通过其
    rendered
    属性有条件地呈现JSF组件。 这是一个基本的启动示例，假设您正在运行具有Servlet 3.0 / EL 2.2的容器，并且已按照Servlet 3.0规范声明了
    /WEB-INF/web.xml
    （否则，
    .contains()
    在EL中不起作用，您必须编写自定义EL功能）。 
    <!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;
    }

}
    就这样。
    2020-06-12 0 0
    分享
    为什么被折叠? 0 个回复被折叠

    要回复问题请先登录或注册

    或代码 OrCode.com 备案号：粤ICP备15020848号-1
    Escape time: 0.037727117538452