Primefaces对话框中包含动态UI

我正在做一个学校项目，遇到了动态ui插入的问题。我目前在JSF2.0/Primefaces3M1工作。主要的问题是，我想要一个具有动态内容的Primefaces对话框，该对话框通过菜单栏进行更改。

对话框组件包含一个ui:include标记，src设置为托管bean属性。菜单项链接到更改此属性的bean方法。

主要问题是变量根本没有改变，我目前正在使用警报来显示这个变量。目前正在使用remoteCommand，但我也已经尝试过在菜单项组件中使用action/actionlistener。如有任何帮助，我们将不胜感激。

这是包含菜单栏和对话框的主页面。

<?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 xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:p="http://primefaces.prime.com.tr/ui"
  xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
    <title>KunstInHuis: Main</title> 
</h:head>
<h:body style="font-size: 12px;">
    <h:form id="mainForm">
        <f:metadata>
            <f:event type="preRenderView" listener="#{login.verifyAccess}"/>
        </f:metadata>
        <p:remoteCommand name="lazyANew" actionListener="#{main.goToAboNew}" onsuccess="alert('test')"/>
        <p:remoteCommand name="lazyAList" actionListener="#{main.goToAboList}" onsuccess="alert('test')"  />
        <p:remoteCommand name="lazyASearch" actionListener="#{main.goToAboSearch}" onsuccess="alert('test')" />
        <p:menubar autoSubmenuDisplay="true"> 
            <p:submenu label="Abonnementen"> 
                <p:menuitem value="Nieuw" onclick="lazyANew()" onsuccess="alert('#{main.goToPage}')"/>
                <p:menuitem value="Lijst" onclick="lazyAList()" onsuccess="alert('#{main.goToPage}')" />
                <p:menuitem value="Zoek"  onclick="lazyASearch()" onsuccess="alert('#{main.goToPage}')"/>
            </p:submenu>  
            <p:submenu label="Klanten">
                <p:menuitem value="Nieuw" url="#"  />  
                <p:menuitem value="Lijst" url="#"/>               
            </p:submenu>
            <p:submenu label="Kunstwerken">
                <p:menuitem value="Nieuw" url="#" />  
                <p:menuitem value="Lijst" url="#"/>               
            </p:submenu>  
        </p:menubar>
    </h:form>
    <p:dialog  id="mainDialog" header="Abonnement aanmaken" widgetVar="dlg0" minHeight="300" minWidth="450" 
              resizable="true" modal="false" >
        <ui:include src="#{main.goToPage}" />
    </p:dialog>
</h:body>

这是我的后盾。

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package com.page.beans;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.event.ActionEvent;
/**
 *
 * @author wezlee
 */
@ManagedBean(name = "main")
@ViewScoped
public class mainMenuBean implements Serializable {
private boolean panelRender=false;
private String goToPage = "./includes/forms/abboCreate.xhtml";
/** Creates a new instance of mainMenuBean */
public mainMenuBean() {
}
public void goToAboNew(ActionEvent e){
    goToPage="./includes/forms/abboCreate.xhtml";
}
public void goToAboNew(){
    goToPage="./includes/forms/abboCreate.xhtml";
}
public void goToAboList(ActionEvent e){
    goToPage="./includes/forms/abboList.xhtml";
}
public void goToAboList(){
    goToPage="./includes/forms/abboList.xhtml";
}
public void goToAboSearch(ActionEvent e){
    goToPage="./includes/forms/abboSearch.xhtml";
}
public void goToAboSearch(){
    goToPage="./includes/forms/abboSearch.xhtml";
}
/**
 * @return the goToPage
 */
public String getGoToPage() {
    return goToPage;
}
public void setGoToPage(String src){
    this.goToPage=src;
}
}

实际上，我认为更新backing值的方法看起来工作得很好。问题可能在于如何显示它。当页面最初呈现时，会评估goToPage的值，并将其放入返回到用户浏览器的页面内容中。一旦在用户端设置了该值，它将不会与backingbean重新同步，直到页面的该部分被重新呈现。

我相信primefaces remoteCommand允许您使用update="客户端id"使用AJAX来实现这一点。不过，我不是一个相貌出众的人，所以我做了这个小测试。首先更改遥控器命令：

<p:remoteCommand name="lazyANew" actionListener="#{main.goToAboNew}" update="testOutput" />
<p:remoteCommand name="lazyAList" actionListener="#{main.goToAboList}" update="testOutput"  />
<p:remoteCommand name="lazyASearch" actionListener="#{main.goToAboSearch}" update="testOutput" />

然后在页面内容中添加一个简单的文本字段，并使用相应的Id:

Page target: <h:outputText value="#{main.goToPage}" id="testOutput" />

您的输出文本应该开始同步。只要这有效，您就可以简单地将更新从testOutput重新定位到mainDialog，这样您就应该开始工作了。

相关内容

最新更新

热门标签：