Java JSF2.0：延迟渲染（复合）组件&x27；在AJAX调用重新呈现内容之前

我的目标是动态加载JSF2.0中组件的内容。用例是这样的：用户单击某个按钮，通过AJAX打开一个包含大量内容的模式面板。由于它的重量，我想延迟加载，直到/如果用户确实需要它。如果用户关闭此面板，它实际上不会从DOM中删除，只是淡出。如果用户再次单击初始化按钮，则显示先前加载的面板

我知道我可以使用

rendered=“#{cc.attrs.visibilityState=='hidden'}”

阻止呈现内容，并且我可以通过JSF AJAX调用重新呈现组件。但是，如何动态调整复合组件的属性，以便在组件周围进行第二次渲染

1） 我知道我可以做到：

<h:outputLink>Foo
    <f:ajax event="click" render="theComponentIWantToUpdate" listener="#{someBean.someMethod()}" />
</h:outputLink>

Foo

然后以编程方式调整组件要更新的属性（更改

{cc.attrs.visibilityState}

）的值，使其实际呈现完整内容。但实际上如何做到这一点呢

2） 另外，问题是我不想在每次按下按钮时更新（重新渲染）

组件更新

，只在第一次按下按钮时更新（请参见业务案例）。如何为该调用的

调用设置评估？它具有禁用的

属性，但它只命令是否实际呈现AJAX处理程序（不在每次按下链接时进行评估）

3） 此外，我可能希望在单击链接时首先执行一些自定义javascript，并且仅使用
jsf.AJAX.request（）
通过javascript执行AJAX请求。但是，该函数不支持提供
listener
属性，因此我不知道如何使用原始javascript
jsf.ajax.request（）执行支持bean方法？实际上，有一个类似的问题没有合适的答案（请参阅）。
部分解决方案：

下面是我发送AJAX请求的链接（在复合组件中）：

下面是我要渲染的目标：

<modalWindow:modalWindow id="modalWindow">
    <quickMenu:quickMenuOverlay id="quickMenuOverlay" />
</modalWindow:modalWindow>



ModalWindow将目标简单地包装到一个漂亮的窗口面板中。在ModalWindow中：

<composite:implementation>
    <h:outputScript library="component/modalWindow" name="modalWindow.js" target="head" />
    <h:outputStylesheet library="component/modalWindow" name="ModalWindow.css" />

    <h:panelGroup id="root" layout="block" styleClass="modalWindow hide">
        <ui:fragment rendered="#{cc.attrs.contentRenderingEnabled}">
            ...all the wrapping elements with <composite:insertChildren /> within it
            <script type="text/javascript">
                // Fade it in
                var win = ModalWindow.getInstance('#{cc.clientId}');  // this gets the instance, available everywhere
                win.position(#{cc.attrs.left}, #{cc.attrs.top});
                win.resize(#{cc.attrs.width}, #{cc.attrs.height});
                win.fadeIn();
            </script>
        </ui:fragment>
    </h:panelGroup>

    <ui:fragment rendered="#{!cc.attrs.contentRenderingEnabled}">
        <script type="text/javascript">
            // Initialize modalWindow when it is rendered for the first time
            var win = new ModalWindow('#{cc.clientId}');  // will be publicly available through ModalWindow static methods
        </script>
    </ui:fragment>

</composite:implementation>


…所有包装元素都包含在其中
//淡入
var win=ModalWindow.getInstance（'#{cc.clientId}'）；//这就得到了无处不在的实例
win.position（#{cc.attrs.left}，#{cc.attrs.top}）；
调整大小（#{cc.attrs.width}，#{cc.attrs.height}）；
win.fadeIn（）；
//第一次渲染时初始化modalWindow
var win=new ModalWindow（'#{cc.clientId}'）；//将通过ModalWindow静态方法公开

问题出在哪里？每次用户单击按钮时都会发送AJAX请求（因此每次都会重新加载并淡出窗口）。我需要能够控制何时/是否实际发送AJAX请求

所有这些东西都让我怀念ApacheWicket，尽管我不知道如何使用它：）
部分解决方案：

下面是我发送AJAX请求的链接（在复合组件中）：

下面是我要渲染的目标：

<modalWindow:modalWindow id="modalWindow">
    <quickMenu:quickMenuOverlay id="quickMenuOverlay" />
</modalWindow:modalWindow>



ModalWindow将目标简单地包装到一个漂亮的窗口面板中。在ModalWindow中：

<composite:implementation>
    <h:outputScript library="component/modalWindow" name="modalWindow.js" target="head" />
    <h:outputStylesheet library="component/modalWindow" name="ModalWindow.css" />

    <h:panelGroup id="root" layout="block" styleClass="modalWindow hide">
        <ui:fragment rendered="#{cc.attrs.contentRenderingEnabled}">
            ...all the wrapping elements with <composite:insertChildren /> within it
            <script type="text/javascript">
                // Fade it in
                var win = ModalWindow.getInstance('#{cc.clientId}');  // this gets the instance, available everywhere
                win.position(#{cc.attrs.left}, #{cc.attrs.top});
                win.resize(#{cc.attrs.width}, #{cc.attrs.height});
                win.fadeIn();
            </script>
        </ui:fragment>
    </h:panelGroup>

    <ui:fragment rendered="#{!cc.attrs.contentRenderingEnabled}">
        <script type="text/javascript">
            // Initialize modalWindow when it is rendered for the first time
            var win = new ModalWindow('#{cc.clientId}');  // will be publicly available through ModalWindow static methods
        </script>
    </ui:fragment>

</composite:implementation>


…所有包装元素都包含在其中
//淡入
var win=ModalWindow.getInstance（'#{cc.clientId}'）；//这就得到了无处不在的实例
win.position（#{cc.attrs.left}，#{cc.attrs.top}）；
调整大小（#{cc.attrs.width}，#{cc.attrs.height}）；
win.fadeIn（）；
//第一次渲染时初始化modalWindow
var win=new ModalWindow（'#{cc.clientId}'）；//将通过ModalWindow静态方法公开

问题出在哪里？每次用户单击按钮时都会发送AJAX请求（因此每次都会重新加载并淡出窗口）。我需要能够控制何时/是否实际发送AJAX请求

所有这些东西都让我怀念ApacheWicket，尽管我不知道如何使用它：）
好的，我选择我自己的部分解决方案作为目前接受的解决方案。如果有人有更好的建议，我会很高兴地改变选择：）好的，我选择我自己的部分解决方案作为暂时接受的解决方案。如果有人有更好的建议，我会很高兴地改变选择：）