在 Java 中创建多个 PrimeFaces 对话框

Create multiple PrimeFaces dialogs in Java

我想向用户显示多条警告消息。用户必须确认他已阅读。

我尝试了 PrimeFaces DialogFramework

PrimeFaces.current().dialog().showMessageDynamic(new FacesMessage(FacesMessage.SEVERITY_INFO, "Message-1", "message-1"), false);
PrimeFaces.current().dialog().showMessageDynamic(new FacesMessage(FacesMessage.SEVERITY_INFO, "Message-2", "message-2"), false);

但是第二次调用会覆盖对话框中的内容,用户只会看到第二条消息。

我试过JQueryUI,可以正确显示多个对话框,但很难将 PrimeFaces 样式添加到对话框中。

function showDialog(id, title, content) {
  var dialog = document.createElement("div");
  dialog.id = id;
  dialog.title = title;
  dialog.innerHTML = content;
  document.body.appendChild(dialog);
  $("#" + id).dialog({
    modal: true,
    buttons: {
      Ok: function() {
        $(this).dialog( "close" );
      }
    }
  });
}

$(function() {
  showDialog("dialog-1", "Message-1", "message-1");
  showDialog("dialog-2", "Message-2", "message-2");
});

有没有一种方法可以使用 PrimeFaces DialogFramework 来显示多个对话框,或者有一种简单的方法可以将 PF 样式添加到 JQuery-Dialog 中?

我有办法解决我的问题。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html   lang="en"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:p="http://primefaces.org/ui">

<h:head>
    <title>HTML message in dialog</title>
</h:head>

<h:body>
    <h:panelGrid>
        <a href="./index.html">back to index</a>
        <h:panelGroup>
            <h:form id="my-form">
                <p:commandButton value="show"
                                 immediate="true"
                                 action="#{showMultipleDialogsBean.show()}" />
            </h:form>
        </h:panelGroup>
    </h:panelGrid>
</h:body>
</html>

import java.io.Serializable;

import javax.faces.component.html.HtmlOutputText;
import javax.faces.context.FacesContext;
import javax.faces.event.AbortProcessingException;
import javax.faces.event.ActionEvent;
import javax.faces.event.ActionListener;
import javax.faces.view.ViewScoped;
import javax.inject.Named;

import org.primefaces.PrimeFaces;
import org.primefaces.component.commandbutton.CommandButton;
import org.primefaces.component.dialog.Dialog;
import org.primefaces.component.panelgrid.PanelGrid;

@Named
@ViewScoped
public class ShowMultipleDialogsBean implements Serializable {

    public void show() {
        for (int i = 1; i < 4; ++i) {
            final HtmlOutputText text = new HtmlOutputText();
            text.setEscape(false);
            text.setValue("<p>Sample <strong>text</strong></p>");

            final PanelGrid grid = new PanelGrid();
            grid.getChildren().add(text);

            final CommandButton ok = new CommandButton();
            ok.addActionListener(new RemoveDialogListener());
            ok.setValue("OK");
            grid.getChildren().add(ok);

            final Dialog dialog = new Dialog();
            dialog.setHeader("Dialog-" + i);
            dialog.getChildren().add(grid);
            dialog.setVisible(true);

            FacesContext.getCurrentInstance()
                    .getViewRoot()
                    .findComponent("my-form")
                    .getChildren()
                    .add(dialog);
            PrimeFaces.current().ajax().update("my-form");
        }
    }

    public static class RemoveDialogListener implements ActionListener {
        @Override
        public void processAction(ActionEvent event) throws AbortProcessingException {
            // button -> panel grid -> dialog
            final Dialog dialog = (Dialog) ((CommandButton) event.getSource()).getParent().getParent();
            dialog.setVisible(false);
            FacesContext.getCurrentInstance()
                    .getViewRoot()
                    .findComponent("my-form")
                    .getChildren()
                    .remove(dialog);
            PrimeFaces.current().ajax().update("my-form");
        }
    }
}

单击按钮时,bean 将创建三个对话框。我添加了一个确定按钮以获得用户的确认。如果单击创建的对话框将从文档中删除。