Data confusion in dialog after validation

[Qian Zhao]

Primefaces:3.3.1 or 3.2....
JSF:
<!-- jsf -->com.sun.faces 2.1.2


this is my index page.this page have the datatable. In this ,I deleted some code filed.Basically be to see p:commandButton.
add p:commandButton and edit commandButton show the same dialog.
you can see this image,and this code.chinese you can ignore.

<p:dataTable var="ss" value="#{userinfoBean.list}"   id="tableId" 
					paginatorPosition="bottom" rowIndexVar="index" paginator="true"
					rows="10"
					paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {CurrentPageReport}" 
					currentPageReportTemplate="#{component.rowCount == 0 ? '0/0' : '{currentPage}/{totalPages}'} "
					style="margin-top: 5px;" emptyMessage="no data" >
					<f:facet name="header">
						User information
						<div style="text-align: right; position: relative; margin: -13px 0px 0px 0px; vertical-align: middle">
							<p:commandButton value="add" icon="ui-icon ui-icon-plus"  actionListener="#{userinfoBean.resetDlg()}" update=":userdataDlgId"  oncomplete="dialogHeaderValueChange();userdataDlgVar.show();removeRedBox();"   />
						</div>
					</f:facet>
					<p:column >
						<f:facet name="header">
							<h:outputText value="account" />
						</f:facet>
						<h:outputText value="#{ss.account}" />
					</p:column>
					<p:column >
						<f:facet name="header">
							<h:outputText value="pwd" />
						</f:facet>
						<h:outputText value="#{ss.password}" />
					</p:column>
					<p:column >
						<f:facet name="header">
							<h:outputText value="realName" />
						</f:facet>
						<h:outputText value="#{ss.realname}" />
					</p:column>
					
					<p:column style="text-align: center;width:18px;">
						<f:facet name="header">
							<h:outputText value="Used" />
						</f:facet>
						<h:outputText value="#{ss.usable eq 'Y'?'Y':'N' }" />
					</p:column>
					
					<p:column style="text-align: center;width:18px;">
						<f:facet name="header">
							<h:outputText value="for" />
						</f:facet>
						<p:commandButton  oncomplete="dialogHeaderValueChangeTwo();userdataDlgVar.show();removeRedBox();"  
							icon="ui-icon ui-icon-pencil" title="Edit" update=":userdataDlgId"  
							 style="width:18px;height:18px;">
							<f:setPropertyActionListener target="#{userinfoBean.userinfo}" value="#{ss}" />
							<f:setPropertyActionListener target="#{userinfoBean.isModify}" value="true" />
							<f:setPropertyActionListener target="#{userinfoBean.sex}" value="#{ss.sex}" />
							<f:setPropertyActionListener target="#{userinfoBean.usable}" value="#{ss.usable}" />
						</p:commandButton>
					</p:column>
				</p:dataTable>
			</h:form>
			
		</p:panel>
		<script type="text/javascript">
			function dialogHeaderValueChange(){
				userdataDlgVar.titlebar.children('span.ui-dialog-title').html('addDialog'); 
			}	
			function dialogHeaderValueChangeTwo(){
				userdataDlgVar.titlebar.children('span.ui-dialog-title').html('editDialog'); 
			}
			function removeRedBox(){
			    $(".ui-state-error").removeClass("ui-state-error");
			}
		
			function myrefresh()
			{
				if(document.getElementsByClassName("ui-messages-error-summary").length!=0){
					alert("havae error CSS!");
			    	         window.location.reload();
				} 
			}
		</script>
		
	</ui:define>
	<ui:define name="dialog">
		<ui:include src="operate.xhtml"></ui:include>
	</ui:define>
</ui:composition>
				

	<ui:composition 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.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:c="http://java.sun.com/jstl/core">
	<p:dialog header="Js assignment" widgetVar="userdataDlgVar" showEffect="fade" 
		hideEffect="fade" modal="true" resizable="false" id="userdataDlgId">
		<p:ajax event="close"  oncomplete="myrefresh();"></p:ajax>
		<h:form id="userdataFormId" prependId="false">
			<p:messages id="userdataMsgId"  />
			<p:growl id="userdataGrowlId" life="1000" />
			<h:panelGrid columns="4"
				columnClasses="column1,column2,column1,column2">
				
				<h:outputText value="account:" />
				<p:inputText id="in" value="#{userinfoBean.userinfo.account}" disabled="#{userinfoBean.isModify}" required="true" requiredMessage="account:not null!">
				</p:inputText>
				
				<h:outputText value="password:" />
				<p:inputText value="#{userinfoBean.userinfo.password}"  required="true" requiredMessage="password:not null">
				</p:inputText>
				
				<h:outputText value="realname:" />
				<p:inputText value="#{userinfoBean.userinfo.realname}"/>
				
				<h:outputText value="age:" />
				<p:inputText value="#{userinfoBean.userinfo.age}"/>
				
				<h:outputText value="email:" />
				<p:inputText value="#{userinfoBean.userinfo.email}"/>
				
				<h:outputText value="address:" />
				<p:inputText value="#{userinfoBean.userinfo.address}" />
				
				

				<h:outputText value="usable:" />
				<p:selectOneRadio value="#{userinfoBean.usable}"  required="true" requiredMessage="usable:not null!">
					<f:selectItem itemLabel="Y" itemValue="Y" />
					<f:selectItem itemLabel="N" itemValue="N" />
				</p:selectOneRadio>

			</h:panelGrid>
				
			<p:spacer width="10px" height="10px"></p:spacer>

			<div align="center">
				<p:commandButton value="modify"  icon="ui-icon ui-icon-check"  style="margin-right:5px"  rendered="#{userinfoBean.isModify}" 
					actionListener="#{userinfoBean.sumbitDlgData()}"   
					oncomplete="aboutMeRequest(xhr, status, args);"  
					update=":userinfoFormId,:userdataFormId"  />
				<p:commandButton value="add"  icon="ui-icon ui-icon-check"  style="margin-right:5px"  rendered="#{!userinfoBean.isModify}"  
					actionListener="#{userinfoBean.sumbitDlgData()}"   
					oncomplete="aboutMeRequest(xhr, status, args);"  
					update=":userinfoFormId,:userdataFormId"  />
				<p:commandButton type="button" value="cancel"  onclick="userdataDlgVar.hide()"  icon="ui-icon ui-icon-cancel" />
			</div>

		</h:form>
		<script type="text/javascript">
			function aboutMeRequest(xhr, status, args) {
				if (args.aboutMeAddInfo == "Y") {
					userdataDlgVar.hide();
				}
			}
			
		</script>
	</p:dialog>
</ui:composition>

===============================================
you can see this above code:<p:ajax event="close" oncomplete="myrefresh();"></p:ajax>.
myrefresh(); is jscode,it's :
function myrefresh()
{
if(document.getElementsByClassName("ui-messages-error-summary").length!=0){
alert("havae error CSS!");
window.location.reload();
}
}

if dialog have uesd "ui-messages-error-summary" css,index.xhtml will reload.
Now,we don't used this JScode <p:Ajax>.and you see this images.
1.First.
I click index.xhtml's addButton.
show I need dialog.Effect as shown in figure:


And I click this dialog's add button,this button is p:commandButton.
Because some textbox have ==> required="true" requiredMessage="account:not null!".
So..Validation and page show error ..Effect as shown in figure:



OK..now,we click this dialog cancel button.
And ,we return index.xhtml.and click index's editButton.


you can see this,page data is error.


The correct data should be like this


lase: If you click first "editButton", validation and page show error,To continue to open the dialog.Whether to add or edit,the data will error.





Bean code :

package org.credo.system.controller;

import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;

import javax.annotation.PostConstruct;
import javax.annotation.Resource;
import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;

import org.credo.model.Userinfo;
import org.credo.system.service.UserinfoService;
import org.primefaces.context.RequestContext;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.context.annotation.Scope;
import org.springframework.stereotype.Controller;

@SuppressWarnings({"unchecked"})
@Controller
@Scope("view")
public class UserinfoBean implements Serializable{

	protected Logger log = LoggerFactory.getLogger(getClass());
	private static final long serialVersionUID = 1L;
	@Resource UserinfoService userinfoService;
	
	private String queryBuilderAccount;
	private List<Userinfo> list=new ArrayList<Userinfo>();
	private Userinfo userinfo=new Userinfo();
	private boolean isModify=true;
	private String sex;
	private String usable;
	
	@PostConstruct
	public void queryUserInfo(){
		try {
			list=this.userinfoService.queryAll("Userinfo");
		} catch (Exception e) {
			e.printStackTrace();
		}
	}
	
	public void sumbitDlgData(){
		userinfo.setSex(sex);
		userinfo.setUsable(usable);
		try {
			if (isModify) {
				this.userinfoService.update(userinfo);
			} else {
				this.userinfoService.insert(userinfo);
				this.isModify=true;
			}
		} catch (Exception e) {
			e.printStackTrace();
			FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "MySQL ERROR!", ""));
			return;
		}
		queryUserInfo();
		
		Map<String, Object> map =FacesContext.getCurrentInstance().getExternalContext().getSessionMap();
		Userinfo userinfoSession=(Userinfo) map.get("userinfo");
		if(userinfo.getId()==userinfoSession.getId()){
			map.put("userinfo", userinfo);
		}
		FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("successful!", ""));
		RequestContext.getCurrentInstance().addCallbackParam("aboutMeAddInfo", "Y");
	}
	
	public void resetDlg(){
		this.userinfo=null;
		this.userinfo=new Userinfo();
		this.isModify=false;
		this.sex=null;
		this.usable="";
		
	}

	public List<Userinfo> getList() {
		return list;
	}
	public void setList(List<Userinfo> list) {
		this.list = list;
	}
	public Userinfo getUserinfo() {
		return userinfo;
	}
	public void setUserinfo(Userinfo userinfo) {
		this.userinfo = userinfo;
	}
	public String getQueryBuilderAccount() {
		return queryBuilderAccount;
	}
	public void setQueryBuilderAccount(String queryBuilderAccount) {
		this.queryBuilderAccount = queryBuilderAccount;
	}
	public boolean getIsModify() {
		return isModify;
	}
	public void setIsModify(boolean isModify) {
		this.isModify = isModify;
	}
	public String getSex() {
		return sex;
	}
	public void setSex(String sex) {
		this.sex = sex;
	}
	public String getUsable() {
		return usable;
	}
	public void setUsable(String usable) {
		this.usable = usable;
	}
}

package org.credo.system.service;


import org.credo.base.service.BaseService;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

@SuppressWarnings("rawtypes")
@Transactional
@Service
public class UserinfoService extends BaseService{
              //BaseService have CRUD.
}

I hava no ideal.so i write some javaScript code for this problem,

function myrefresh()
{
/* alert("1:"+document.getElementsByClassName("ui-messages-error-summary")); */
if(document.getElementsByClassName("ui-messages-error-summary").length!=0){
alert("havae error CSS!");
window.location.reload();
}
}

But,I think is bad.........


thanks for you help.

[Qian Zhao]

this problem resolve. url:http://forum.primefaces.org/viewtopic.php?f=3&t=23682

[Qian Zhao]

tandraschko
Expert Member
Posts: 1172
Joined: 03 Dec 2010, 21:11
30 Jul 2012, 17:08
Re: <I changed topic>Data confusion in dialog after validati
This isn't a bug and we have a more flexible component in primefaces-extensions: http://fractalsoft.net/primeext-showcase-mojarra/sections/resetInput/masterDetailScenario.jsf

if you try it,maybe