Как обновить родительскую страницу jsf из всплывающего окна richfaces - PullRequest
4 голосов
/ 20 августа 2011

У меня есть страница JSF с несколькими полями. Я следовал этому учебнику от BalusC, и все хорошо. Затем я добавил поддержку RichFaces, которая работает нормально. Я вижу, как работают всплывающие окна и т. Д.

Теперь я пытаюсь сделать так, чтобы после регистрации человека я хотел показать имя во всплывающем окне (это тоже хорошо, я вижу это во всплывающем окне). Затем я хочу иметь возможность изменить это имя во всплывающем окне и отразить это в родителе, но я понятия не имею, как это сделать. Пожалуйста, посмотрите.

Страница 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;
        }

    }

Обновлен бит после предложения Арджана Тиймса

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

Ответы [ 2 ]

4 голосов
/ 20 августа 2011

Просто переместите rich:popupPanel из основной формы и присвойте ему свою собственную форму. Если вы затем отправите форму, которая в диалоговом окне, вся страница будет перерисована.

Поскольку базовый компонент имеет область видимости, ранее пользовательские данные будут сохранены, и только имя пользователя будет обновлено в соответствии с тем, что вы ввели в диалоговом окне.

Кроме того, вы можете отправить форму через AJAX, дать основному бланку ID и повторно обработать его.

1010 * Е.Г. *

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

Я использовал здесь A4J commandButton с удобным атрибутом oncomplete. Вы можете сделать то же самое с атрибутом onevent в стандартном теге ajax, но используя немного больше кода.

Обратите внимание, что если в основной форме есть ошибки проверки, ее невозможно изменить без другой меры противодействия из другой формы (если вы столкнетесь с ней, лучше всего открыть новый вопрос для этой конкретной ситуации).

0 голосов
/ 26 января 2013

Уже ответили, но у меня была похожая проблема. В моем представлении есть <rich:dataTable> для отображения данных, и я хочу отфильтровать результаты по выбранным элементам в <rich:popupPanel>. У меня была та же проблема: выбор опции не обновлял таблицу (используя событие <a4j:ajax>).

Всплывающие окна по умолчанию прикрепляются к тегу <body>. Итак, я добавил domElementAttachment="form" к <rich:popupPanel>, и это сработало.

...