0
JSF 2.2 및 PrimeFaces 3.5 응용 프로그램. home.xhtml 페이지에는 각각에 3 개의 중첩 된 데이터 테이블 및 CRUD 버튼이있는 tabView가 있습니다.유효성 검사 실패시 하나의 PrimeFaces 대화 상자가 표시되지 않습니다.
각 CRUD 버튼은 다른 형태의 대화 상자 창을 호출합니다. 문제는 대화 상자 중 하나에서 유효성 검사 오류가 발생할 때마다 해당 속성이 visible="#{facesContext.validationFailed}" (IMHO)이기 때문에 표시됩니다.
사용자가 유효한 값을 입력하거나 취소 할 때까지 유효성을 검사하지 못한 대화 상자 하나만 표시해야합니다. 버튼 (대화 상자 양식 값을 지 웁니다).
모든 대답은 높이 평가됩니다.
home.xhtml :
<?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">
<ui:component xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ex="http://java.sun.com/jsf/composite/nsobchuk">
<h:head>
<link rel="stylesheet" href="../css/style.css"/>
</h:head>
<h:body>
<h:form id="logout" class="logout" >
<h:commandButton action="#{loginBean.logout()}" value="logout"/>
</h:form>
<p:tabView id="tab" orientation="left">
<p:tab title="Users">
<h:form id="form1">
<h:panelGrid columns="9">
<p:commandButton type="button" value="Add" onclick="dlg1.show()"/>
<p:dialog id="addUserDialog" header="Add Dialog" modal="true" closable="false"
widgetVar="dlg1" width="620" visible="#{facesContext.validationFailed}">
<h:panelGrid columns="3">
<h:outputLabel for="login" value="Login: "/>
<p:inputText id="login" value="#{homeBean.newUser.login}" required="true"
label="Login: " maxlength="20">
<f:validator binding="#{loginValidator}"/>
</p:inputText>
<p:message for="login"/>
<h:outputLabel for="password" value="Password: "/>
<p:password id="password" value="#{homeBean.newUser.password}" required="true"
feedback="true" label="Password: " maxlength="32"/>
<p:message for="password" />
<h:outputLabel for="firstName" value="First Name: "/>
<p:inputText id="firstName" value="#{homeBean.newUser.firstName}"
label="First Name: " maxlength="20"/>
<p:message for="firstName"/>
<h:outputLabel for="lastName" value="Last Name: "/>
<p:inputText id="lastName" value="#{homeBean.newUser.lastName}"
label="Last Name: " maxlength="20"/>
<p:message for="lastName"/>
<h:outputLabel for="role" value="Role: "/>
<p:selectOneMenu id="role" value="#{homeBean.newUser.role}" required="true" style="width: 80px;" >
<f:selectItem itemLabel="user" itemValue="ROLE_USER" />
<f:selectItem itemLabel="admin" itemValue="ROLE_ADMIN" />
</p:selectOneMenu>
<p:message for="role"/>
</h:panelGrid>
<p:commandButton value="Cancel" immediate="true" onclick="dlg1.hide()" update=":tab:form1:addUserDialog">
<p:resetInput target="addUserDialog" />
</p:commandButton>
<p:commandButton value="Add" update=":tab:users, :tab:form1:addUserDialog" process="@this"
onclick="if (args & & !args.validationFailed) dlg1.hide()" action="#{homeBean.addUser}"/>
</p:dialog>
<p:commandButton id="editUser" type="button" value="Edit" onclick="dlg2.show()" disabled="#{homeBean.selectedUser == null}"/>
<p:dialog id="editUserDialogerDialog" widgetVar="dlg2" header="Sorry" >
<h:outputText value="I didn't have enogh time to finish this functionality. Feel free to test other buttons."/>
</p:dialog>
<p:commandButton id="deleteUser" type="button" onclick="confirmation1.show()" value="Delete" disabled="#{homeBean.selectedUser == null}"/>
<p:confirmDialog message="Are you sure you want to delete user?" header="Confirmation"
severity="alert" widgetVar="confirmation1">
<p:commandButton value="Yes" update=":tab:users" process="@this" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"
oncomplete="confirmation1.hide()" action="#{homeBean.deleteUser}" />
<p:commandButton value="No" onclick="confirmation1.hide()" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>
</p:confirmDialog>
</h:panelGrid>
</h:form>
<p:dataTable id="users" var="user" value="#{homeBean.users}"
scrollable="true" scrollHeight="250" selectionMode="single"
selection="#{homeBean.selectedUser}" rowKey="#{user.userId}"
sortMode="single">
<p:ajax event="rowSelect" listener="#{homeBean.onUserRowSelect}" update=":tab:form1:deleteUser, :tab:form1:editUser"/>
<p:ajax event="rowUnselect" listener="#{homeBean.onUserRowUnselect}" update=":tab:form1:deleteUser, :tab:form1:editUser"/>
<p:column headerText="Login" sortBy="#{user.login}">
<h:outputText value="#{user.login}"/>
</p:column>
<p:column headerText="Password" sortBy="#{user.password}">
<h:outputText value="#{user.password}"/>
</p:column>
<p:column headerText="Role" sortBy="#{user.role}">
<h:outputText value="#{user.role}"/>
</p:column>
<p:column headerText="Name" sortBy="#{user.firstName}">
<h:outputText value="#{user.firstName}"/>
</p:column>
<p:column headerText="Surname" sortBy="#{user.lastName}">
<h:outputText value="#{user.lastName}"/>
</p:column>
</p:dataTable>
<ex:exporter target=":tab:users" fileName="Users"/>
</p:tab>
<p:tab title="Computers">
<h:form id="form2">
<h:panelGrid columns="9">
<p:commandButton type="button" value="Add" onclick="dlg3.show()"/>
<p:dialog id="addCompDialog" header="Add Dialog" draggable="true" closable="false" modal="true"
widgetVar="dlg3" width="600" visible="#{facesContext.validationFailed}" >
<h:panelGrid columns="3">
<h:outputLabel for="pclogin" value="Login: "/>
<p:inputText id="pclogin" value="#{homeBean.newComputer.login}" required="true"
label="Login: " maxlength="20">
<f:validator binding="#{loginValidator}"/>
</p:inputText>
<p:message for="pclogin"/>
<h:outputLabel for="pcpassword" value="Password: "/>
<p:password id="pcpassword" value="#{homeBean.newComputer.password}" required="true"
feedback="true" label="Password: " maxlength="32"/>
<p:message for="pcpassword" />
<h:outputLabel for="compName" value="Computer Name: "/>
<p:inputText id="compName" value="#{homeBean.newComputer.computerName}" required="true"
label="Computer Name: " maxlength="20"/>
<p:message for="compName"/>
<h:outputLabel for="ipaddress" value="IP address: "/>
<p:inputText id="ipaddress" value="#{homeBean.newComputer.ipAddress}" required="true"
label="IP address: " maxlength="20"/>
<p:message for="ipaddress"/>
</h:panelGrid>
<p:commandButton value="Cancel" immediate="true" onclick="dlg3.hide()" update=":tab:form2:addCompDialog">
<p:resetInput target="addCompDialog" />
</p:commandButton>
<p:commandButton value="Add" update=":tab:computers, :tab:form2:addCompDialog" process="@this"
onclick="if (args & & !args.validationFailed) dlg3.hide()" action="#{homeBean.addComputer}"/>
</p:dialog>
<p:commandButton id="editComp" type="button" value="Edit" onclick="dlg4.show()" disabled="#{homeBean.selectedComputer == null}"/>
<p:dialog id="editCompDialog" widgetVar="dlg4" header="Sorry" >
<h:outputText value="I didn't have enogh time to finish this functionality. Feel free to test other buttons."/>
</p:dialog>
<p:commandButton id="deleteComp" type="button" onclick="confirmation2.show()" value="Delete" disabled="#{homeBean.selectedComputer == null}"/>
<p:confirmDialog message="Are you sure you want to delete this computer?" header="Confirmation"
severity="alert" widgetVar="confirmation2">
<p:commandButton value="Yes" update=":tab:computers" process="@this" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"
oncomplete="confirmation2.hide()" action="#{homeBean.deleteComputer}"/>
<p:commandButton value="No" onclick="confirmation2.hide()" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>
</p:confirmDialog>
</h:panelGrid>
</h:form>
<p:dataTable id="computers" var="computer" value="#{homeBean.computers}"
scrollable="true" scrollHeight="250" selectionMode="single"
selection="#{homeBean.selectedComputer}" rowKey="#{computer.computerId}"
sortMode="single" >
<p:ajax event="rowSelect" listener="#{homeBean.onCompRowSelect}" update=":tab:form2:editComp, :tab:form2:deleteComp"/>
<p:column headerText="Login" sortBy="#{computer.login}">
<h:outputText value="#{computer.login}"/>
</p:column>
<p:column headerText="Password" sortBy="#{computer.password}">
<h:outputText value="#{computer.password}"/>
</p:column>
<p:column headerText="Name" sortBy="#{computer.computerName}" >
<h:outputText value="#{computer.computerName}"/>
</p:column>
<p:column headerText="IP address" sortBy="#{computer.ipAddress}">
<h:outputText value="#{computer.ipAddress}"/>
</p:column>
</p:dataTable>
<ex:exporter target=":tab:computers" fileName="Computers"/>
</p:tab>
<p:tab title="Applications">
<h:form id="form3">
<h:panelGrid columns="9">
<p:commandButton type="button" value="Add" onclick="dlg5.show()"/>
<p:dialog id="addAppDialog" header="Add Dialog" draggable="true" closable="false" modal="true"
widgetVar="dlg5" width="600" visible="#{facesContext.validationFailed}" >
<h:panelGrid columns="3">
<h:outputLabel for="appName" value="Name: "/>
<p:inputText id="appName" value="#{homeBean.newApplication.appName}" required="true"
label="Name: "/>
<p:message for="appName"/>
<h:outputLabel for="vendorName" value="Vendor: "/>
<p:inputText id="vendorName" value="#{homeBean.newApplication.vendorName}"
label="Vendor: " required="true" />
<p:message for="vendorName"/>
<h:outputLabel for="appLicense" value="Requires license: "/>
<p:selectOneMenu id="appLicense" value="#{homeBean.newApplication.licenseRequired}" required="true" style="width: 80px;" >
<f:selectItem itemLabel="True" itemValue="#{true}" />
<f:selectItem itemLabel="False" itemValue="#{false}" />
</p:selectOneMenu>
<p:message for="appLicense"/>
</h:panelGrid>
<p:commandButton value="Cancel" immediate="true" onclick="dlg5.hide()" update=":tab:form3:addAppDialog">
<p:resetInput target="addAppDialog" />
</p:commandButton>
<p:commandButton value="Add" update=":tab:applications, :tab:form3:addAppDialog" process="@this"
onclick="if (args & & !args.validationFailed) dlg5.hide()" action="#{homeBean.addApplication}"/>
</p:dialog>
<p:commandButton id="editApp" type="button" value="Edit" onclick="dlg6.show()" disabled="#{homeBean.selectedApplication == null}"/>
<p:dialog id="editAppDialog" widgetVar="dlg6" header="Sorry" >
<h:outputText value="I didn't have enogh time to finish this functionality. Feel free to test other buttons."/>
</p:dialog>
<p:commandButton id="deleteApp" type="button" onclick="confirmation3.show()" value="Delete" disabled="#{homeBean.selectedApplication == null}"/>
<p:confirmDialog message="Are you sure you want to delete this application?" header="Confirmation"
severity="alert" widgetVar="confirmation3">
<p:commandButton value="Yes" update=":tab:applications" process="@this" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"
oncomplete="confirmation3.hide()" action="#{homeBean.deleteApplication}"/>
<p:commandButton value="No" onclick="confirmation3.hide()" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>
</p:confirmDialog>
</h:panelGrid>
</h:form>
<p:dataTable id="applications" var="app" value="#{homeBean.applications}"
scrollable="true" scrollHeight="250" selectionMode="single"
selection="#{homeBean.selectedApplication}" rowKey="#{app.appId}"
sortMode="single" >
<p:ajax event="rowSelect" listener="#{homeBean.onAppRowSelect}" update=":tab:form3:editApp, :tab:form3:deleteApp"/>
<p:column headerText="Name" sortBy="#{app.appName}">
<h:outputText value="#{app.appName}"/>
</p:column>
<p:column headerText="Vendor" sortBy="#{app.vendorName}" >
<h:outputText value="#{app.vendorName}"/>
</p:column>
<p:column headerText="License required" sortBy="#{app.licenseRequired}">
<h:outputText value="#{app.licenseRequired}"/>
</p:column>
</p:dataTable>
<ex:exporter target=":tab:applications" fileName="Applications" />
</p:tab>
</p:tabView>
</h:body>
</ui:component>
HomeBean.java :
package com.infostroy.adminportal.controller.bean;
import com.infostroy.adminportal.bean.BaseBean;
import com.infostroy.adminportal.model.Application;
import com.infostroy.adminportal.model.Computer;
import com.infostroy.adminportal.model.User;
import com.infostroy.adminportal.service.HibernateDBManager;
import java.io.IOException;
import java.math.BigInteger;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.util.List;
import org.primefaces.context.RequestContext;
import org.primefaces.event.SelectEvent;
import org.primefaces.event.UnselectEvent;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Component;
@Component
@Scope("session")
public class HomeBean extends BaseBean {
private static final String editUserBtn = "tab:form1:editUser";
private static final String deleteUserBtn = "tab:form1:deleteUser";
private static final String editCompBtn = "tab:form2:editComp";
private static final String deleteCompBtn = "tab:form2:deleteComp";
private static final String editAppBtn = "tab:form3:editApp";
private static final String deleteAppBtn = "tab:form3:deleteApp";
@Autowired
private HibernateDBManager hibernateDBManager;
private List<User> users;
private List<Computer> computers;
private List<Application> applications;
private User selectedUser, newUser;
private Computer selectedComputer, newComputer;
private Application selectedApplication, newApplication;
private RequestContext rc;
@Override
public void init() {
setUsers(hibernateDBManager.getAllUsers());
setComputers(hibernateDBManager.getAllComputers());
setApplications(hibernateDBManager.getAllApplications());
newUser = new User();
newComputer = new Computer();
newApplication = new Application();
rc = RequestContext.getCurrentInstance();
}
public void addUser() throws NoSuchAlgorithmException {
if (newUser != null && newUser.getPassword() != null) {
MessageDigest md = MessageDigest.getInstance("MD5");
md.update(newUser.getPassword().getBytes());
String hash = new BigInteger(1, md.digest()).toString(16);
newUser.setPassword(hash);
if (hibernateDBManager.insertUser(newUser)) {
users.add(newUser);
}
}
}
public void deleteUser() throws IOException {
if (selectedUser != null) {
if (hibernateDBManager.deleteUserById(selectedUser.getUserId()) > 0) {
users.remove(selectedUser);
selectedUser = null;
rc.update(deleteUserBtn);
rc.update(editUserBtn);
}
}
}
public void addComputer() {
if (newComputer != null && hibernateDBManager.insertComputer(newComputer)) {
computers.add(newComputer);
}
}
public void deleteComputer() {
if (selectedComputer != null) {
if (hibernateDBManager.deleteComputerById(selectedComputer.getComputerId()) > 0) {
computers.remove(selectedComputer);
selectedComputer = null;
rc.update(editCompBtn);
rc.update(deleteCompBtn);
}
}
}
public void addApplication() {
if (newApplication != null && hibernateDBManager.insertApplication(newApplication)) {
applications.add(newApplication);
}
}
public void deleteApplication() {
if (selectedApplication != null) {
if (hibernateDBManager.deleteApplicationById(selectedApplication.getAppId()) > 0) {
applications.remove(selectedApplication);
selectedApplication = null;
rc.update(editAppBtn);
rc.update(deleteAppBtn);
}
}
}
public void onUserRowSelect(SelectEvent event) {
setSelectedUser((User) event.getObject());
}
public void onUserRowUnselect(UnselectEvent event) {
setSelectedUser(null);
}
public void onCompRowSelect(SelectEvent event) {
setSelectedComputer((Computer) event.getObject());
}
public void onAppRowSelect(SelectEvent event) {
setSelectedApplication((Application) event.getObject());
}
public List<Computer> getComputers() {
return computers;
}
public void setComputers(List<Computer> computers) {
this.computers = computers;
}
public List<Application> getApplications() {
return applications;
}
public void setApplications(List<Application> applications) {
this.applications = applications;
}
public Computer getSelectedComputer() {
return selectedComputer;
}
public void setSelectedComputer(Computer selectedComputer) {
this.selectedComputer = selectedComputer;
}
public Application getSelectedApplication() {
return selectedApplication;
}
public void setSelectedApplication(Application selectedApplication) {
this.selectedApplication = selectedApplication;
}
public List<User> getUsers() {
return users;
}
public void setUsers(List<User> users) {
this.users = users;
}
public User getSelectedUser() {
return selectedUser;
}
public void setSelectedUser(User selectedUser) {
this.selectedUser = selectedUser;
}
public User getNewUser() {
return newUser;
}
public void setNewUser(User newUser) {
this.newUser = newUser;
}
public Computer getNewComputer() {
return newComputer;
}
public void setNewComputer(Computer newComputer) {
this.newComputer = newComputer;
}
public Application getNewApplication() {
return newApplication;
}
public void setNewApplication(Application newApplication) {
this.newApplication = newApplication;
}
}
왜 visible 속성을 사용하고 있습니까? dlg.open() 및 dlg.hide를 사용하여 가시성을 처리해야합니다. 또한, IMHO (TabView 외부) 페이지의 끝에 대화 상자를 넣는 것이 더 좋을 것이라고 생각합니다. 각 대화 상자는 자체 양식을 사용하는 것이 좋습니다. – Damian
유효성 검사가 실패하고 유효성 검사 오류를 표시하는 경우 대화 상자가 표시되어야하기 때문에 visible 특성을 사용하고 있습니다. – amenoire
은 visible 속성이 아닌 다르게 처리됩니다. 이를 위해 RequestContext params (onclick 특성의 코드를 기반으로 사용하는 것으로 생각됩니다.) 유효성 검사 메시지로 대화 상자를 표시하는 방법을 보여주는 primefaces의이 쇼케이스 예제를 살펴보십시오. http : //www.primfaces .org/showcase/ui/dialogLogin.jsf – Damian