當(dāng)前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

primefaces_PrimeFaces：在动态生成的对话框中打开外部页面

發(fā)布時間：2023/12/3 编程问答 35 豆豆

生活随笔收集整理的這篇文章主要介紹了 primefaces_PrimeFaces：在动态生成的对话框中打开外部页面小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

primefaces

我已經(jīng)在即將出版的PrimeFaces Cookbook版本2中寫過一篇食譜的博客。在這篇文章中，我想發(fā)表第二篇關(guān)于一個名為Dialog Framework的小型框架的文章。我個人喜歡它，因為我記得我為使用Struts框架付出同樣的代價。當(dāng)您想將外部頁面加載到彈出窗口中并向該頁面提交一些數(shù)據(jù)時，您必須調(diào)用window.open并使用隱藏表單，將傳遞的值設(shè)置為隱藏字段，通過JavaScript將表單提交給外部頁面，然后等到該頁面已準(zhǔn)備好在window.onload或document.ready 。很多繁瑣的工作。 PrimeFaces可以為您完成這項工作，此外， p:dialog還提供了漂亮的用戶界面來替代彈出窗口。

PrimeFaces對話框的常規(guī)用法是使用p:dialog的聲明方法。除了這種聲明式方法之外，還有一種編程方法。編程方法基于編程API，其中在運行時創(chuàng)建和銷毀對話框。它稱為Dialog Framework 。對話框框架用于在動態(tài)生成的對話框中打開外部頁面。用法很簡單， RequestContext提供兩個方法： openDialog和closeDialog允許打開和關(guān)閉動態(tài)對話框。此外，對話框框架還可以將數(shù)據(jù)從對話框中顯示的頁面?zhèn)骰氐秸{(diào)用者頁面。

在本食譜中，我們將演示Dialog Framework中可用的所有功能。我們將以編程方式打開一個帶有選項的對話框，并將參數(shù)傳遞給該對話框中顯示的頁面。我們還將滿足在源（調(diào)用方）頁面和對話框之間進(jìn)行通信的可能性。

做好準(zhǔn)備

Dialog Framework在faces-config.xml需要以下配置：

<application><action-listener>org.primefaces.application.DialogActionListener</action-listener><navigation-handler>org.primefaces.application.DialogNavigationHandler</navigation-handler><view-handler>org.primefaces.application.DialogViewHandler</view-handler> </application>

怎么做…

我們將開發(fā)一個帶有單選按鈕的頁面，以選擇一本可用的PrimeFaces圖書進(jìn)行評級。單擊按鈕“ Rate the selected book后，評分本身將在對話框中發(fā)生。

屏幕快照的XHTML代碼段在下面列出。

<p:messages id="messages" showSummary="true" showDetail="false"/><p:selectOneRadio id="books" layout="pageDirection" value="#{dialogFrameworkBean.bookName}"><f:selectItem itemLabel="PrimeFaces Cookbook" itemValue="PrimeFaces Cookbook"/><f:selectItem itemLabel="PrimeFaces Starter" itemValue="PrimeFaces Starter"/><f:selectItem itemLabel="PrimeFaces Beginner's Guide" itemValue="PrimeFaces Beginner's Guide"/><f:selectItem itemLabel="PrimeFaces Blueprints" itemValue="PrimeFaces Blueprints"/> </p:selectOneRadio><p:commandButton value="Rate the selected book"process="@this books"actionListener="#{dialogFrameworkBean.showRatingDialog}"style="margin-top: 15px"><p:ajax event="dialogReturn" update="messages" listener="#{dialogFrameworkBean.onDialogReturn}"/> </p:commandButton>

對話框中的頁面是整頁bookRating.xhtml其中包含Rating組件p:rating 。它還顯示選擇進(jìn)行評級的書的名稱。

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"xmlns:f="http://xmlns.jcp.org/jsf/core"xmlns:h="http://xmlns.jcp.org/jsf/html"xmlns:p="http://primefaces.org/ui"> <f:view contentType="text/html" locale="en"><f:metadata><f:viewParam name="bookName" value="#{bookRatingBean.bookName}"/></f:metadata><h:head><title>Rate the book!</title></h:head><h:body><h:form>What is your rating for the book <strong>#{bookRatingBean.bookName}</strong>?<p/><p:rating id="rating"><p:ajax event="rate" listener="#{bookRatingBean.onrate}"/><p:ajax event="cancel" listener="#{bookRatingBean.oncancel}"/></p:rating></h:form></h:body> </f:view> </html>

下一個屏幕截圖演示了對話框的外觀。

單擊評級星或取消符號將關(guān)閉對話框。源（呼叫者）頁面顯示一條消息，其中所選的評級值在0到5之間。

最有趣的部分是bean中的邏輯。豆DialogFrameworkBean通過調(diào)用方法打開的對話框中的等級頁面openDialog()與結(jié)果，選項和POST參數(shù)上RequestContext實例。此外，bean定義了一個AJAX偵聽器onDialogReturn() ，當(dāng)對話框關(guān)閉后從對話框返回數(shù)據(jù)（選定的評級）時，將調(diào)用該偵聽onDialogReturn() 。

@Named @ViewScoped public class DialogFrameworkBean implements Serializable {private String bookName;public void showRatingDialog() {Map<String, Object> options = new HashMap<String, Object>();options.put("modal", true);options.put("draggable", false);options.put("resizable", false);options.put("contentWidth", 500);options.put("contentHeight", 100);options.put("includeViewParams", true);Map<String, List<String>> params = new HashMap<String, List<String>>();List<String> values = new ArrayList<String>();values.add(bookName);params.put("bookName", values);RequestContext.getCurrentInstance().openDialog("/views/chapter11/bookRating", options, params);}public void onDialogReturn(SelectEvent event) {Object rating = event.getObject();FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "You rated the book with " + rating, null);FacesContext.getCurrentInstance().addMessage(null, message);}// getters / setters... }

Bean BookRatingBean為Rating component定義了兩個偵聽器。當(dāng)用戶分別單擊星號和取消符號時，將調(diào)用它們。我們呼吁有closeDialog()上RequestContext實例來觸發(fā)對話框關(guān)閉和額定電流值傳遞給聽眾提到onDialogReturn()

@Named @RequestScoped public class BookRatingBean {private String bookName;public void onrate(RateEvent rateEvent) {RequestContext.getCurrentInstance().closeDialog(rateEvent.getRating());}public void oncancel() {RequestContext.getCurrentInstance().closeDialog(0);}// getters / setters... }

這個怎么運作…

RequestContext提供了兩個同名openDialog方法，可在運行時動態(tài)打開對話框。第一個只有一個參數(shù)–用于解決導(dǎo)航案例的邏輯結(jié)果。第二個參數(shù)包含三個參數(shù)-結(jié)果，對話框的配置選項和發(fā)送到對話框中顯示的視圖的參數(shù)。在示例中，我們使用了第二個變體。選項作為鍵值對放入Map中。參數(shù)也放入Map 。在我們的案例中，我們輸入所選書籍的名稱。之后，通過f:viewParam在對話框頁面bookRating.xhtml接收該名稱。 f:viewParam將傳輸?shù)膮?shù)設(shè)置到BookRatingBean ，以便在Rating組件上方的標(biāo)題中可用。

提示：請參閱《 PrimeFaces用戶指南》以查看受支持對話框的配置選項的完整列表。

讓我們經(jīng)歷請求-響應(yīng)生命周期。一旦收到由命令按鈕引起的請求響應(yīng)，就會創(chuàng)建一個對話框，其中包含iframe 。 iframe的URL指向整頁，在本例中為bookRating.xhtml 。該頁面將向下流并顯示在對話框中。如您所見，總是有兩個請求：第一個初始POST和第二個GET由iframe發(fā)送。請注意，對話框框架僅適用于初始AJAX請求。非AJAX請求將被忽略。另請注意，對話框的標(biāo)題取自HTML title元素。

正如我們上面已經(jīng)提到，這個對話框可以通過編程關(guān)閉invoking該方法closeDialog上RequestContext實例。在調(diào)用者頁面上，觸發(fā)對話框的按鈕需要有一個dialogReturn事件的AJAX偵聽器，以便能夠從對話框接收任何數(shù)據(jù)。數(shù)據(jù)作為參數(shù)傳遞給方法closeDialog(Object data) 。在示例中，我們傳遞了一個正整數(shù)值rateEvent.getRating()或0 。

翻譯自: https://www.javacodegeeks.com/2015/01/primefaces-opening-external-pages-in-dynamically-generated-dialog.html

primefaces

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎勵來咯，堅持創(chuàng)作打卡瓜分現(xiàn)金大獎

總結(jié)

以上是生活随笔為你收集整理的primefaces_PrimeFaces：在动态生成的对话框中打开外部页面的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。

上一篇：权益净利率计算公式权益净利率计算公式是
下一篇： java编译器jdk版本_以编程方式确定