2011-05-26 20 views
6

Estoy trabajando en un proyecto escolar y encontré un problema con la inserción de la interfaz de usuario dinámica. Actualmente estoy trabajando en JSF2.0/Primefaces 3 M1. El principal problema es que quiero tener un cuadro de diálogo Primefaces con contenido dinámico que se modifica mediante una barra de menú.IU dinámica incluida en Primefaces Dialog

El componente de diálogo contiene una etiqueta ui: include con src establecido en una propiedad de bean administrada. Los elementos de menú están vinculados a métodos de beans que cambian esta propiedad.

El problema principal es que la variable no está cambiando en absoluto, actualmente estoy usando alertas para mostrar esta variable. Actualmente estoy trabajando con remoteCommand pero también lo he intentado con action/actionlistener en el componente menuitem. Cualquier ayuda sería apreciada.

Esta es la página principal con la barra de menú y el cuadro de diálogo.

<?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> 

y este es mi bean de respaldo.

/* 
* 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; 
} 
} 

Respuesta

1

En realidad, creo que los métodos para actualizar el valor de respaldo parecen funcionar bien. El problema probablemente sea la forma en que intentas mostrarlo. Cuando la página se procesa inicialmente, el valor de goToPage se evalúa y se coloca en el contenido de la página devuelta al navegador del usuario. Una vez que este valor se establece en el lado del usuario, no se volverá a sincronizar con el bean de respaldo hasta que esa parte de la página se vuelva a generar.

Creo que un comando remoto de caras principales le permite hacer esto con AJAX usando update = "id del lado del cliente". Aunque no soy un chico de las caras principales, así que armé esta pequeña prueba. En primer lugar cambiar sus remoteCommands:

<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" /> 

A continuación, agregue un campo de texto simple a su contenido de la página con el identificador correspondiente:

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

Su texto de salida debe iniciar la sincronización. Mientras eso funcione, simplemente puede redirigir la actualización de testOutput a mainDialog y debería estar en el negocio.

+0

Gracias, pensé que RemoteCommand me permitiría omitir todo el sistema de actualización, supongo que estaba equivocado. Intenté colocar mi panel con contenido dinámico dentro de otro panel, que luego pude actualizar. Pero el problema que se plantea entonces es que pierdo la funcionalidad de algunos componentes PrimeFaces, por ejemplo dejará de funcionar, al igual que otros componentes como autocompletar, botones de comando, lo que sea. Realmente estoy empezando a sentir que estoy atascado entre una roca y un lugar difícil. – wezlee