RichFaces:当AJAX操作成功时显示通知“弹出窗口”

时间:2009-03-23 14:50:48

标签: ajax jsf richfaces effect ajax4jsf

我们目前正在开发基于Java EE 5,JSF,Facelets和RichFaces的B2B网上商店。到目前为止,该技术确实运作良好,但现在我面临一个小问题,我无法弄清楚如何解决:

产品列为表格,其中每个项目都可以通过点击行末尾的小图标添加到购物篮中。添加产品是通过AJAX完成的,以避免完全重新加载页面。只需使用h:dataTablea4j:commandLink调用将所选产品添加到购物篮的操作方法,即可正常使用。即使重新渲染的篮子总是在侧栏中可见也能正常工作。

由于AJAX的性质,操作成功或至少已完成,没有明显的指示(除了侧面的总变化)。现在我想添加一个“弹出”框,当AJAX操作完成时,它会在add-icon旁边显示,说明该项目已添加到购物篮中。几秒钟后,此框应自动消失。

这是我认为应该工作的(popup_message和popup_content css-classes使得框浮动在其标记位置之上):

<h:dataTable ....>
    ...
    <h:column>
        <a4j:commandLink action="...">
            <rich:effect event="oncomplete" targetId="addedMessage"
                 type="Appear" />
            <rich:effect event="oncomplete" targetId="addedMessage"
                 type="Appear" params="{delay:3.0, duration:1.0}" />
        </a4j:commandLink>

        <a4j:outputPanel id="addedMessage" styleClass="popup_message"
            style="display: none">
            <a4j:outputPanel layout="block" styleClass="popup_content">
                <h:outputText value="Item added!" />
            </a4j:outputPanel>
        </a4j:outputPanel>
    </h:column>
</h:dataTable>

不幸的是,它根本不显示该框。如果我将“显示”效果的event更改为onclick,则其效果几乎与预期一致。单击图标时立即显示,并在AJAX操作完成后3秒消失。但我不希望它在点击后立即显示,因为表示该项目已添加到购物篮中是错误的,而实际上操作尚未开始。当我想指出一些错误或想要在框中包含一些特定于项目的信息时,这变得更加重要,这只有在添加项目后才可用。

所以任何想法如何做到这一点?为什么为同一事件添加两个效果不起作用?

(我已经看过the effect-example from the RichFaces live demo了。这些示例的功能基本相同,除非他们在明确说明for属性的情况下添加了第二个效果。但即使这样也不适用于我。)

更新:我已尝试将rich:toolTip用于此目的,实际上似乎非常灵活。但无论我做什么,我都无法附加任何内容{ongmplete'(我也尝试过“完整”)a4j:commandLink的事件,除了一个效果......似乎有一些bug /关于该事件的无证行为。我刚刚发现了这个错误报告:RF-3427

3 个答案:

答案 0 :(得分:0)

答案 1 :(得分:0)

你试过rich:status吗?我不会发布一段代码。我认为文档会做得很好。

http://livedemo.exadel.com/richfaces-demo/richfaces/status.jsf

答案 2 :(得分:-1)

您在参数之外定义targetId。你想要做的是:

<rich:effect event="oncomplete" type="Appear" params="targetId:'addedMessage',delay:3.0, duration:1.0" />

尝试一下,我认为它会起作用。