在JSF受管Bean中使用操作方法时,如何显示确认(richfaces)弹出窗口?

问题描述:

也许我们熟悉Javascript中的确认弹出窗口.但是,在此示例中,我想基于RichFaces中具有两个要求的popupPanel创建一个自定义确认弹出窗口:

Perhaps we are familiar with the confirm popup in Javascript. However, in this example, I want to create one custom confirm popup based on popupPanel in richFaces that have 2 requirements:

我可以描述一下确认框的要求如下:

I can describe the requirements of the confirm box is as follows:

  1. 应用程序中的有效数据(通过ManagedBean中的一种操作方法处理)后,将出现自定义确认框,并要求用户确认向数据库中插入数据.

  1. After our application valid data (processed by one action method in ManagedBean), then the custom confirm box appears, and it asks user to confirm insert data to database.

  • 不像我们使用window.confirm时,单击页面中的按钮后会出现确认框.

用户确认确认此窗口,这是将数据插入数据库的操作方法

Users confirm confirm this window, the action method to be implemented to insert data to database

我现在想到的一种解决方案是使用两种动作方法来处理一个弹出窗口.解决问题后,我会在这个问题上通知您.谢谢.

I now think of one solution is to use two action method to handle with one popup. When I solve my problem, I ‘ll notify you in this question. Thank you.

是的,一种方法是使用两种操作方法:一种用于验证,另一种用于实际操作.实际上,这就是我自己在某些项目中一直这样做的方式.

Yes, one way to do that is using two action methods: one for the validation and another for the real action. That's actually the way I've been doing it myself for some projects.

一种好的方法是创建一个包含此功能的复合组件,以便您可以在其他地方重用它.

One good way to do it is to create a composite component wrapping this functionality, so that you can reuse it in other places.

WebContent/resources/my/confirmButton.xhtml中使用以下代码创建一个复合组件:

Create a composite component in WebContent/resources/my/confirmButton.xhtml, with the following code:

resources/my/confirmButton.xhtml :

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
  xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich"
  xmlns:cc="http://java.sun.com/jsf/composite">
<cc:interface>
    <cc:attribute name="message" default="Do you want to proceed?" />
    <cc:attribute name="messageHeader" default="Confirm" />
    <cc:attribute name="action" required="true"
           method-signature="java.lang.String action()" />
    <cc:attribute name="validateMethod" required="true"
           method-signature="java.lang.String action()" />
    <cc:attribute name="value" default="Submit" />
    <cc:attribute name="cancelBtn" default="No" />
    <cc:attribute name="confirmBtn" default="Yes" />
</cc:interface>
<cc:implementation>
    <rich:popupPanel id="popup" header="#{cc.attrs.messageHeader}">
        <p>#{cc.attrs.message}</p>
        <input type="button" value="#{cc.attrs.cancelBtn}"
            onclick="#{rich:component('popup')}.hide()" />
        <a4j:commandButton action="#{cc.attrs.action}"
            value="#{cc.attrs.confirmBtn}" execute="@form" render="@form"
            onclick="#{rich:component('popup')}.hide()" />
    </rich:popupPanel>
    <a4j:commandButton action="#{cc.attrs.validateMethod}"
        value="#{cc.attrs.value}" execute="@form" render="@form"
        oncomplete="if(#{empty facesContext.maximumSeverity}){
            #{rich:component('popup')}.show()
        }" />
</cc:implementation>
</html>

您可能需要更改它,添加必要的属性和样式.

You may want to change it, adding attributes and styling as you see necessary.

完成此操作后,您可以在JSF视图中声明组件的名称空间,并像这样使用和重用:

Having done that, you can declare the namespace for your component your JSF views, and use and reuse like this:

<!DOCTYPE html>
<html ... xmlns:my="http://java.sun.com/jsf/composite/my">
    ...
    <h:form>
        <rich:messages />
        <h:panelGrid>
            Please, type something:
            <h:inputText value="#{someBean.someValue}" required="true" />

            <!-- simple example with the default labels: -->
            <my:confirmButton action="#{someBean.action}"
                validateMethod="#{someBean.preAction}" />

            <!-- second example calling other method and using custom labels: -->
            <my:confirmButton action="#{someBean.action2}"
                validateMethod="#{someBean.preAction}" value="action 2"
                message="Do you REALLY want to proceed?" />
        </h:panelGrid>
    </h:form>
    ...
</html>

另请参见:

复合组件标签信息