2011-08-20 261 views
4

我有一個帶有幾個字段的JSF頁面。我跟着BalusC的這個tutorial,一切都很好。然後我添加了RichFaces支持,它工作正常。我可以看到彈出窗口等工作。如何從richfaces彈出窗口刷新父級jsf頁面

現在我所要做的是,一旦一個人已被註冊,我要顯示在彈出的名字(這也是很好我可以看到,在彈出)。然後,我想能夠在彈出窗口中更改該名稱,並將其反映在父項中,但我不知道如何做到這一點。請看一看。

XHTML頁面

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:a4j="http://richfaces.org/a4j" 
    xmlns:rich="http://richfaces.org/rich"> 
<h:head> 
    <title>Registration</title> 
</h:head> 
<h:body> 
    <h:form> 
     <h:panelGrid columns="3"> 
      <h:outputLabel for="username">Username</h:outputLabel> 
      <h:inputText id="username" value="#{register.user.username}" 
       required="true"> 
       <f:ajax event="blur" render="usernameMessage" /> 
      </h:inputText> 
      <h:message id="usernameMessage" for="username" /> 

      <h:outputLabel for="password">Password</h:outputLabel> 
      <h:inputSecret id="password" value="#{register.user.password}" 
       required="true" redisplay="true"> 
       <f:ajax event="blur" render="passwordMessage" /> 
      </h:inputSecret> 
      <h:message id="passwordMessage" for="password" /> 

      <h:outputLabel for="email">Email</h:outputLabel> 
      <h:inputText id="email" value="#{register.user.email}" 
       required="true"> 
       <f:ajax event="blur" render="emailMessage" /> 
      </h:inputText> 
      <h:message id="emailMessage" for="email" /> 

      <h:outputLabel for="birthdate">Birthdate (yyyy-MM-dd)</h:outputLabel> 
      <h:inputText id="birthdate" value="#{register.user.birthdate}"> 
       <f:convertDateTime pattern="yyyy-MM-dd" /> 
       <f:ajax event="blur" render="birthdateMessage" /> 
      </h:inputText> 
      <h:message id="birthdateMessage" for="birthdate" /> 

      <h:panelGroup /> 
      <h:commandButton value="Register" action="#{register.submit}"> 
       <f:ajax execute="@form" render="@form" /> 
      </h:commandButton> 
      <h:commandButton value="Edit Name in Popup"> 
       <rich:componentControl target="popup" operation="show" /> 
      </h:commandButton> 
      <h:messages globalOnly="true" layout="table" /> 
     </h:panelGrid> 
     <rich:popupPanel id="popup" modal="true" resizeable="true" 
      onmaskclick="#{rich:component('popup')}.hide()"> 
      <f:facet name="header"> 
       <h:outputText value="Simple popup panel" /> 
      </f:facet> 
      <f:facet name="controls"> 
       <h:outputLink value="#" 
        onclick="#{rich:component('popup')}.hide(); return false;"> 
        X 
       </h:outputLink> 
      </f:facet> 

      <h:panelGrid columns="3"> 
       <h:outputLabel for="username2">Username</h:outputLabel> 
       <h:inputText id="username2" value="#{register.user.username}" 
        required="true"> 
       </h:inputText> 
       <h:commandButton value="Register" action="#{register.update}"> 

       </h:commandButton> 
      </h:panelGrid> 

     </rich:popupPanel> 
    </h:form> 
</h:body> 
</html> 

Java類

package com.example; 

import java.io.Serializable; 

import javax.faces.application.FacesMessage; 
import javax.faces.bean.ManagedBean; 
import javax.faces.bean.ViewScoped; 
import javax.faces.context.FacesContext; 

@ManagedBean 
@ViewScoped 
public class Register implements Serializable { 

    private static final long serialVersionUID = 1L; 

    private User user; 

    public Register() { 
     user = new User(); 
    } 

    public void submit() { 
     FacesMessage message = new FacesMessage("Registration succesful!"); 
     FacesContext.getCurrentInstance().addMessage(null, message); 
    } 

    public void update() { 
     FacesMessage message = new FacesMessage("Update succesful!"); 
     FacesContext.getCurrentInstance().addMessage(null, message); 
    } 

    public User getUser() { 
     return user; 
    } 

} 

用戶類別

package com.example; 

    import java.io.Serializable; 
    import java.util.Date; 

    public class User implements Serializable { 

     private static final long serialVersionUID = 1L; 

     private Long id; 
     private String username; 
     private String password; 
     private String email; 
     private Date birthdate; 
     public Long getId() { 
      return id; 
     } 
     public void setId(Long id) { 
      this.id = id; 
     } 
     public String getUsername() { 
      return username; 
     } 
     public void setUsername(String username) { 
      this.username = username; 
     } 
     public String getPassword() { 
      return password; 
     } 
     public void setPassword(String password) { 
      this.password = password; 
     } 
     public String getEmail() { 
      return email; 
     } 
     public void setEmail(String email) { 
      this.email = email; 
     } 
     public Date getBirthdate() { 
      return birthdate; 
     } 
     public void setBirthdate(Date birthdate) { 
      this.birthdate = birthdate; 
     } 

    } 

阿爾揚Tijms'的建議後更新位

<h:form id="form2"> 
    <rich:popupPanel id="popup" modal="true" resizeable="true" onmaskclick="#{rich:component('popup')}.hide()"> 
     <f:facet name="header"> 
      <h:outputText value="Simple popup panel" /> 
     </f:facet> 
     <f:facet name="controls"> 
      <h:outputLink value="#" onclick="#{rich:component('popup')}.hide(); return false;"> 
       X 
      </h:outputLink> 
     </f:facet> 

     <h:panelGrid columns="3"> 
      <h:outputLabel for="username2">Username</h:outputLabel> 
      <h:inputText id="username2" value="#{register.user.username}" required="true"></h:inputText> 
      <h:commandButton value="Register" action="#{register.update}"> 
       <f:ajax execute="@form" render=":form" /> 
      </h:commandButton> 
     </h:panelGrid> 

    </rich:popupPanel> 
</h:form> 

回答

4

只需推動rich:popupPanel出來的主要形式,並給它自己的形式。如果您然後在對話框中提交的表單,整個頁面將重新呈現。

由於支持bean是視圖範圍的,以前的用戶數據將被保留,只有用戶名會,不管你在對話框中輸入更新。

此外,還可以通過AJAX提交表單,給主要形式的ID和重新渲染。

例如

<rich:popupPanel id="popup" modal="true" resizeable="true" onmaskclick="#{rich:component('popup')}.hide()"> 
    <f:facet name="header">Simple popup panel</f:facet> 
    <h:form id="form2"> 
     <h:outputLabel for="username2" value="Username"/> 
     <h:inputText id="username2" value="#{register.user.username}" required="true"/> 
     <a4j:commandButton value="do" action="#{register.update}" render="form" oncomplete="#{rich:component('popup')}.hide()"/>     
    </h:form> 
</rich:popupPanel> 

我用它具有方便oncomplete屬性A4J commandButton這裏。您可以使用標準ajax標籤上的onevent屬性做類似的事情,但使用稍多的代碼。

請注意,如果形式主要有驗證錯誤,這是沒有不可能從其他形式的更新任何反制措施(如果你進入的,你最好打開該特定情況新問題)。

+0

感謝回答,我明白你說的話(我認爲:)),但未能得到正確的代碼。我給了名爲「form」的原始表單ID,並以其他形式將面板外部移動,但彈出窗口仍然不關閉,也沒有更新調試點顯示它正在觸摸該方法,但屏幕流程不正確,請參閱我的更新問題結束。非常感謝您的回覆。謝謝 –

+0

表格需要*在面板中,而不是圍繞它。另外,按鈕應該關閉對話框(例如通過腳本)。 –

+0

不能感謝你是偉大的。你和Blusc的工作原因:) –

0

它已經回答了,但我也有類似的問題。我的觀點有<rich:dataTable>來顯示數據,我想用<rich:popupPanel>中的選定項過濾結果。我有同樣的問題:選擇一個選項沒有更新表(使用<a4j:ajax>事件)。

的彈出式窗口,默認情況下安裝到<body>標籤。所以,我加domElementAttachment="form"<rich:popupPanel>,它工作。

相關問題