Forum:

Ajax status doesn't stop in IE8

Greenhorn

Posts: 26

posted 12 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Hi guys, i turn to your wisdom to help me out on this problem that really has me banging my head against a brick wall. I have a page that uses a4j:status to display a modal panel while an ajax request is in progress.

It works fine in Firefox and google chrome , but in IE8 the modal panel never goes away , even though the request has been completed.

This is the code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.ajax4jsf.org/rich"
	xmlns:a4j="http://richfaces.org/a4j"
	template="/templates/base-panel-menu-horizontal.xhtml">

<ui:define name="tituloPagina">
	#{titulos['novedades.inicio']}
	</ui:define>
	<ui:define name="contenido">
		<a4j:outputPanel id="outerPanelContInd"
			rendered="#{!sucursalBean.isPublica}">
			<rich:panel>
				<h:outputText>
					<h1>ESTA OPCION SOLO ESTA DISPONIBLE PARA RUCS PUBLICOS. RUC
					PRIVADOS DEBEN INGRESAR POR CORPORACIONES.</h1>
				</h:outputText>
			</rich:panel>
		</a4j:outputPanel>
		<a4j:outputPanel rendered="#{sucursalBean.isPublica}">
			<div align="center">
			<table border="0"  >
				<tr>
					<h:panelGrid columns="1" columnClasses="top,top">
						<h:form id="frmContinuidadDerecho">
							<div align="left"><rich:panel id="pnrContinuidadDerecho"
								style="padding:0" headerClass="outpanelHeader">
								<f:facet name="header">
									<rich:spacer id="espacio0" height="2" style=" width : 1px;" />
								</f:facet>
								<h2 align="center"><h:outputText
									value="INGRESO DE CONTINUIDAD INDIVIDUAL" /></h2>
								<rich:panel>
									<table border="0"  >
										<tr>
											<td><h:graphicImage value="/img/information.jpg" /></td>
											<td><h:outputText
												value="#{etiquetas['fusionRucIngresoMensaje.mensaje1']} #{sucursalBean.sucursal.sucursalPK.rucemp} - #{sucursalBean.sucursal.empleador.nomemp}" />
											<br />

</td>
										</tr>
									</table>
								</rich:panel>
							</rich:panel> <rich:panel id="pnrPrincipalContDerecho" style="padding:0"
								headerClass="outpanelHeader">
								<f:facet name="header">
									<rich:spacer id="espacio2" height="2" style=" width : 1px;" />
								</f:facet>
								<h:outputText
									value="#{titulos['fusionRucIngreso.datosEmpleador']}" />

<rich:panel>

<h:panelGrid columns="2" cellpadding="0" cellspacing="3">

<h:outputText value="#{etiquetas['principal.ruc']}" />
										<h:outputText
											value="${sucursalBean.sucursal.sucursalPK.rucemp}"
											style="font-weight:bold" />
										<h:outputText value="#{etiquetas['principal.empresa']}" />
										<h:outputText
											value="${sucursalBean.sucursal.empleador.nomemp}"
											style="font-weight:bold" />
										<h:inputHidden id="hiddenContRucActual"
											value="${sucursalBean.sucursal.sucursalPK.rucemp}"
											binding="#{administracionContinuidadBean.rucActualUI}" />
										<h:inputHidden id="hiddenContRsl"
											value="${sucursalBean.sucursal.empleador.nomemp}"
											binding="#{administracionContinuidadBean.razonSocialUI}" />
										<h:inputHidden id="hiddenContSuc"
											value="${sucursalBean.sucursal.sucursalPK.codsuc}"
											binding="#{administracionContinuidadBean.sucursalUI}" />
									</h:panelGrid>

</rich:panel>
								<br />

<rich:panel>

</td>
												</tr>
											</table>
										</rich:panel>
										<br></br>
										<a4j:outputPanel id="ingresoDatosContWrapper"
											eventsQueue="foo2">
											<h:panelGrid columns="15" cellpadding="2" cellspacing="2">

<h:outputText
													value="#{etiquetas['fusionRucIngreso.rucAnterior']}:" />
												<a4j:outputPanel id="rucAnteriorWrapper">
													<h:inputText
														value="#{administracionContinuidadBean.rucAnterior}"
														maxlength="13" id="rucAnteriorContTxt"
														disabled="#{administracionContinuidadBean.ingresoContinuidadBean.bDeshabilitarRucTexto}">
														<a4j:support event="onblur" ajaxSingle="false" 
															action="#{administracionContinuidadBean.verificarRucAnterior}"
															reRender="mensajeValidacionIngresoCont,sucursalComboWrapper,rucAnteriorWrapper"></a4j:support>
													</h:inputText>
												</a4j:outputPanel>
												<rich:spacer id="espacio3" width="30px">

</rich:spacer>

<h:outputText value="Ingrese la sucursal:" />
												<a4j:outputPanel id="sucursalComboWrapper">
													<rich:comboBox id="comboSucursal"
														value="#{administracionContinuidadBean.sucursalAnterior}"
														defaultLabel="Seleccione una sucursal"
														enableManualInput="false"
														binding="#{administracionContinuidadBean.ingresoContinuidadBean.comboUI}">
														<f:selectItems
															value="#{administracionContinuidadBean.ingresoContinuidadBean.listaSucursalesSelect}"></f:selectItems>
													</rich:comboBox>
												</a4j:outputPanel>
												<rich:spacer id="espacio4" width="30px">

</rich:spacer>
												<h:outputText value="Ingrese la cédula del Empleado:" />
												<h:inputText
													value="#{administracionContinuidadBean.ingresoContinuidadBean.cedulaEmpleado}"
													maxlength="10" id="cedulaTxt">
													<a4j:support event="onblur" ajaxSingle="false"
														action="#{administracionContinuidadBean.comprobarCedula}"
														reRender="mensajeValidacionIngresoCont,botonAgregarWrapper"></a4j:support>
												</h:inputText>
												<rich:suggestionbox for="cedulaTxt" var="result"
													minChars="10" />
												<rich:spacer id="espacio5" width="10px" />
												<rich:spacer id="espacio6" width="10px" />
												<a4j:outputPanel id="botonAgregarWrapper">
													<a4j:commandButton id="botonAgregarCont"
														value="#{botones['agregar']}" styleClass="boton"
														reRender='rucAnteriorContTxt,mensajeValidacionIngresoCont,continuidadTable,continuidadTableConfirmacion,botonEnviarListaContWrapper,sucursalComboWrapper,botonAgregarWrapper'
														action="${administracionContinuidadBean.agregarContinuidadATablaIngreso}"
														rendered="#{administracionContinuidadBean.ingresoContinuidadBean.bEstadoBotonAgregar}" />
												</a4j:outputPanel>
												<rich:spacer id="espacio7" width="10px" />
												<a4j:commandButton styleClass="boton" value="Limpiar Campos"
													action="#{administracionContinuidadBean.limpiarDatosIngresoIndividual}"
													reRender="ingresoDatosContWrapper,sucursalComboWrapper,rucAnteriorWrapper,botonAgregarWrapper,mensajeValidacionIngresoCont" />
											</h:panelGrid>
										</a4j:outputPanel>
									</rich:panel>
									<h:panelGrid columns="1" cellpadding="2" cellspacing="2"
										id="mensajeValidacionIngresoContPanelGrid">
										<h:outputText
											value="#{administracionContinuidadBean.mensajeValidacionIngresoContinuidad}"
											style="font-weight:bold; color:red"
											id="mensajeValidacionIngresoCont" />
									</h:panelGrid>

<a4j:commandLink id="xCmdContDer"
															value="#{botones['eliminar']}"
															action="${administracionContinuidadBean.eliminarSeleccionTabla}"
															styleClass="boton"
															reRender="continuidadTable,continuidadTableConfirmacion,mensajeValidacionIngresoCont">
															<a4j:actionparam value="#{row}"
																assignTo="#{administracionContinuidadBean.ingresoContinuidadBean.indiceFila}" />
														</a4j:commandLink>

</rich:column>
												</rich:dataTable>

<rich:spacer id="espacio8" height="20">

</rich:spacer>
												<tr></tr>
												<h:panelGrid columns="3">
													<h:outputText
														value="#{etiquetas['fusionRucIngreso.Observaciones']}" />
													<rich:spacer id="espacio9" width="60" height="10">

</rich:spacer>
													<h:inputTextarea id="observacionContDer"
														requiredMessage="Favor ingrese la observación"
														style=" width : 300px; height : 80px;"
														value="#{administracionContinuidadBean.ingresoContinuidadBean.observacion}"></h:inputTextarea>
												</h:panelGrid>
												<br></br>
												<rich:panel>
													<table border="0"  >
														<tr>
															<td><h:graphicImage value="/img/information.jpg" /></td>
															<td><h:outputText
																value="IMPORTANTE: PARA INGRESO DE LA CONTINUIIDAD " />
															<br />
															<h:outputText
																value="Escoja un periodo para generación de planillas. El cual debe ser la FECHA DE INGRESO DE CONTINUIDAD AL NUEVO RUC. " />
															<br />
															<h:outputText
																value="Se generarán planillas a partir de esa fecha."></h:outputText>
															</td>
														</tr>
													</table>
												</rich:panel>

<rich:spacer id="espacio10" height="20">

</rich:spacer>
												
													<h:panelGrid columns="7">
														<h:outputText
															value="#{etiquetas['fusionRucIngreso.PeticionPlanillas']}" />
														<rich:spacer id="espacio11" width="30"></rich:spacer>
														<h:outputLabel for="comboMesCont">
															<h:outputText value="Seleccione el mes:" />
														</h:outputLabel>
														<rich:comboBox id="comboMesCont"
															value="#{administracionContinuidadBean.ingresoContinuidadBean.mes}"
															enableManualInput="false">
															<f:selectItem itemValue="01" />
															<f:selectItem itemValue="02" />
															<f:selectItem itemValue="03" />
															<f:selectItem itemValue="04" />
															<f:selectItem itemValue="05" />
															<f:selectItem itemValue="06" />
															<f:selectItem itemValue="07" />
															<f:selectItem itemValue="08" />
															<f:selectItem itemValue="09" />
															<f:selectItem itemValue="10" />
															<f:selectItem itemValue="11" />
															<f:selectItem itemValue="12" />
														</rich:comboBox>
														<rich:spacer id="espacio12"
															style=" height : 10px;width : 40px"></rich:spacer>
														<h:outputLabel for="periodoGeneracionContDer">
															<h:outputText value="Ingrese el año:" />
														</h:outputLabel>
														<rich:inputNumberSpinner id="periodoGeneracionCont"
															minValue="2009"
															maxValue="#{administracionContinuidadBean.ingresoContinuidadBean.anioMaximoGeneracionPlanilla}"
															enableManualInput="false"
															value="#{administracionContinuidadBean.ingresoContinuidadBean.anio}">
														</rich:inputNumberSpinner>
													</h:panelGrid>
												
											</h:panelGrid></td>
										</tr>
										<tr>
											<td><h:panelGrid columns="1" cellpadding="2"
												cellspacing="2">
												<f:facet name="header">
													<rich:spacer id="espacio14" height="2"
														style=" width : 1px;" />
												</f:facet>
												<a4j:region>
													<a4j:outputPanel ajaxRendered="true"
														id="resultadoContWrapper">
														<rich:panel
															rendered="#{administracionContinuidadBean.ingresoContinuidadBean.bEstadoPanelResultados}">
															<table border="0">
																<tr>
																	<td>
																	<h4><h:outputText
																		value="RESULTADOS DEL PROCESO DE INGRESO CONTINUIDAD INDIVIDUAL DE DERECHO A FR"
																		rendered="#{administracionContinuidadBean.ingresoContinuidadBean.bEstadoPanelResultados}" /></h4>
																	<rich:spacer id="espacio15" style="height: 20px" /> <rich:dataTable
																		value="#{administracionContinuidadBean.ingresoContinuidadBean.listaExitosos}"
																		var="it" width="543px" id="resultadosTabla"
																		rowKeyVar="row"
																		rendered="#{administracionContinuidadBean.ingresoContinuidadBean.bEstadoPanelResultados}">
																		<rich:column id="rsRucListaCol2" width="114px">
																			<f:facet name="header">
																				<h:outputText id="rsRucListaLbl2"
																					value="#{etiquetas['fusionRucIngresoTabHead.rucLista']}" />
																			</f:facet>
																			<h:outputText id="rsRucListaVal2" value="#{it.ruc}" />
																		</rich:column>
																		<rich:column id="rsCedulaListaCol2" width="318px">
																			<f:facet name="header">
																				<h:outputText id="rsCedulaListaLbl2" value="Cédula" />
																			</f:facet>
																			<h:outputText id="rsCedulaListaVal2"
																				value="#{it.cedula}" />
																		</rich:column>
																		<rich:column id="obsListaCol2" width="120px"
																			style="text-align:center">
																			<f:facet name="header">
																				<h:outputText id="obsListaLbl2"
																					value="Observaciones" />
																			</f:facet>
																			<h:panelGrid columns="2" id="resultadoSiNoCont">
																				<h:graphicImage value="/img/yes.png"
																					rendered="#{it.procesado}"></h:graphicImage>
																				<h:graphicImage value="/img/no.png"
																					rendered="#{!it.procesado}"></h:graphicImage>
																			</h:panelGrid>
																			<rich:toolTip for="resultadoSiNoCont"
																				value="#{it.observacion}"></rich:toolTip>
																		</rich:column>
																	</rich:dataTable></td>
																</tr>
															</table>
														</rich:panel>
													</a4j:outputPanel>
												</a4j:region>

</h:panelGrid></td>
										</tr>
									</table>
								</rich:panel>
								<h:panelGrid columns="6" cellpadding="2" cellspacing="2">
									<a4j:outputPanel ajaxRendered="true"
										id="botonEnviarListaContWrapper">
										<a4j:commandButton id="botonEnviarListaCont"
											value="#{botones['enviarLista']}" styleClass="boton"
											onclick="Richfaces.showModalPanel('confirmationContinuidad',{width:450, top:100})"
											rendered="#{administracionContinuidadBean.ingresoContinuidadBean.bEstadoBotonRegistrar}" />
									</a4j:outputPanel>
									<a4j:jsFunction name="submit"
										action="#{administracionContinuidadBean.guardarContinuidad}"
										reRender="mensajeValidacionIngresoContinuidad,resultadoContWrapper,mensajeValidacionIngresoCont" />
									<a4j:commandButton value="Cancelar"
										action="#{administracionContinuidadBean.limpiarPantallaIngresoContinuidad}"
										styleClass="boton"
										reRender='ingresoDatosContWrapper,sucursalComboWrapper,rucAnteriorWrapper,botonAgregarWrapper,mensajeValidacionIngresoCont,rucAnteriorContTxt,mensajeValidacionIngresoCont,continuidadTable,botonEnviarListaContWrapper,comboMesCont,periodoGeneracionCont,observacionCont' />

<h:commandButton value="#{botones['salir']}"
										action="${fusionRucBacking.salir}" styleClass="boton"
										immediate="true" />

</h:panelGrid>
							</rich:panel></div>
						</h:form>
						<a4j:status 
							onstart="Richfaces.showModalPanel('esperaCalendarioModalCont',{width:450, top:200})"
							onstop="Richfaces.hideModalPanel('esperaCalendarioModalCont'); return false;">
						</a4j:status>
						<rich:modalPanel id="esperaCalendarioModalCont" minHeight="200"
							minWidth="450" height="100" width="250" zindex="2000"
							moveable="true">
							<f:facet name="header">
								<h:outputText value="Procesando"></h:outputText>
							</f:facet>
							<h:outputText value="Favor Espere..."></h:outputText>
						</rich:modalPanel>
						<rich:modalPanel id="confirmationContinuidad" autosized="true">
							<rich:panel>
								<f:facet name="header">ACUERDO PARA CONTINUIDAD DE DERECHO INDIVIDUAL DE FONDOS DE RESERVA</f:facet>
								<h:panelGrid>
									<rich:panel>
										<f:facet name="header">DATOS DEL EMPLEADOR</f:facet>
										<h:panelGrid columns="2" cellpadding="0" cellspacing="3">
											<h:outputText value="#{etiquetas['principal.ruc']}" />
											<h:outputText
												value="${sucursalBean.sucursal.sucursalPK.rucemp}"
												style="font-weight:bold" />
											<h:outputText value="#{etiquetas['principal.empresa']}" />
											<h:outputText
												value="${sucursalBean.sucursal.empleador.nomemp}"
												style="font-weight:bold" />
										</h:panelGrid>
									</rich:panel>
									<rich:panel>
										<rich:scrollableDataTable
											value="#{administracionContinuidadBean.ingresoContinuidadBean.listaIngresados}"
											var="item" width="443px" rows="5" height="100px"
											id="continuidadTableConfirmacion">
											<rich:column id="crucListaCol" width="114px">
												<f:facet name="header">
													<h:outputText id="crucListaLbl"
														value="#{etiquetas['fusionRucIngresoTabHead.rucLista']}" />
												</f:facet>
												<h:outputText id="crucListaVal" value="#{item.ruc}" />
											</rich:column>
											<rich:column width="318px" id="crsSocialCol">
												<f:facet name="header">
													<h:outputText id="crsSocialLbl"
														value="#{etiquetas['fusionRucIngresoTabHead.RazonSocial']}" />
												</f:facet>
												<h:outputText id="crsSocialVal" value="#{item.razonSocial}" />
											</rich:column>
											<rich:column id="ccedulaCol" width="318px">
												<f:facet name="header">
													<h:outputText id="ccedulaLbl" value="Cédula" />
												</f:facet>
												<h:outputText id="ccedulaVal" value="#{item.cedula}" />
											</rich:column>
											<rich:column width="318px" id="cnombreCol">
												<f:facet name="header">
													<h:outputText id="cnombreLbl" value="Nombre" />
												</f:facet>
												<h:outputText id="cnombreVal" value="#{item.nombre}" />
											</rich:column>

</rich:scrollableDataTable>
									</rich:panel>
									<h:panelGroup>
										<input type="button" value="OK"
											onclick="#{rich:component('confirmationContinuidad')}.hide();submit();return false" />
										<input type="button" value="Cancelar"
											onclick="#{rich:component('confirmationContinuidad')}.hide();return false" />
									</h:panelGroup>
								</h:panelGrid>
								<h:panelGrid columns="1">
									<h:outputText value="Sr/a Empleador/a."
										style="FONT-SIZE: small;" />
									<br />
									<h:outputText
										value="Esté seguro de autorizar la CONTINUIDAD DE DERECHO, recuerde que una vez que usted acepte se generarán planillas de Fondos Reserva de ser el caso, que serán de su exclusiva responsabilidad;  no existirá reversa alguna. "
										style="FONT-SIZE: small;" />
								</h:panelGrid>
							</rich:panel>

</rich:modalPanel>
					</h:panelGrid>
				</tr>

</table>
			</div>
		</a4j:outputPanel>
	</ui:define>
</ui:composition>

I am desperate please help!!! . Thanks in advance

Marcel Jacome

Greenhorn

Posts: 26

posted 12 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

The page works like this: A value is entered into

Since this is an onblur event , the screen is dimmed and the modal panel shown , then a combobox is updated and the request is completed , but the modal panel is never hidden.

Marcel Jacome

Greenhorn

Posts: 26

posted 12 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

UPDATE: I have discovered the cause of the problem , it seems that under IE8 , there is an incompatibility problem , if you go to View -> Compatibility View , things begin to work again. If the compatibility view is switched off , the modal panel component stops working. What can i do in this case , is there any way to circumvent or avoid this problem? will switching to a better version of Richfaces help here??

Oh sure, it's a tiny ad, but under the right circumstances, it gets bigger.

a bit of art, as a gift, that will fit in a stocking

https://gardener-gift.com