| Author |
Partial page refresh during page onload
|
Swami Gopalan
Greenhorn
Joined: Apr 28, 2008
Posts: 1
|
|
Hi,
I am having problems when I make multiple PPR requests through AJAX at the time of onload of a page. This is what I am doing.
I have two panel boxes which have partial triggers from two different command links. So Panel box 1 has a partial trigger to command link L1 and Panel Box 2 has a partial trigger to command link L2.
On onload of the page body I click on command link L1 and L2 which internally calls two methods on a backing bean.
The problem I am facing is, when the backing method completes executing, it updates/refreshes only one panel. And this behaviour is very inconsistent. Sometimes panel box 1 gets updated/refreshed while sometimes panel box2 gets updated/refreshed. But never does both the panel boxes get updated/refreshed. I dont know if it is a bug in JSF or Browser . Can any one help me and tell what I am doing wrong here. I am giving my JSF code for reference below:
************************* Start *************************************
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:tr="http://myfaces.apache.org/trinidad"
xmlns:trh="http://myfaces.apache.org/trinidad/html">
<jsp:directive.page contentType="text/html;charset=utf-8" />
<script language="javascript">
function loadData() {
alert('before clicking');
var checkLoadStatus;
var contractLoadStatus;
checkLoadStatus = document.getElementById("checkloadStatus").value;
contractLoadStatus = document.getElementById("contractsloadStatus").value;
if(checkLoadStatus==0){
//alert('Check Load Status:['+checkLoadStatus+']');
document.getElementById("checksdataload").click();
//alert('Command Link clicked ');
document.getElementById("body1").style.cursor = "default";
document.getElementById("checkloadStatus").value = "1";
//alert('changed check load status');
}else{
alert('check load status not equal to 0');
}
if(contractLoadStatus==0){
//alert('Contract Load Status:['+contractLoadStatus+']');
document.getElementById("contractsdataload").click();
//alert('Command Link clicked ');
document.getElementById("body1").style.cursor = "default";
document.getElementById("contractsloadStatus").value = "1";
//alert('changed Contracts load status');
}else{
alert('contract load status not equal to 0');
}
alert('End of onload');
}
</script>
<f:view locale="#{preferLocale.locale}">
<trh:html id="html1">
<trh:head title="Member 360" id="head1">
<meta http-equiv="Content-Type"
content="text/html; charset=windows-1252" />
<link rel="stylesheet" charset="UTF-8" type="text/css"
href="/Advisor/iAdvisorWeb/bundles/ic/skins/CCABE/CCABECustom.css" />
</trh:head>
<trh:body id="body1" ONLOAD1="loadData();" >
<tr:form id="form1">
<trh:tableLayout width="100%" borderWidth="0" cellSpacing="1">
<trh:rowLayout valign="top">
<trh:cellFormat width="30%" height="100%" valign="top">
<trh:rowLayout valign="top">
<trh:cellFormat width="100%" height="50%" valign="top">
<tr:commandLink id="checksdataload" partialSubmit="#{!Provider360FlakesBean.checksDataLoaded}" actionListener="#{Provider360FlakesBean.loadChecksData}" />
<tr:inputHidden id="checkloadStatus" value="#{Provider360FlakesBean.checksData}"/>
<tr:panelBox id="checksPanelBox" partialTriggers="checksdataload" binding="#{Provider360FlakesBean.checksPanel}" contentStyle="border: 1px #2461AA solid;width: 230px; height: 170px;valign: top" background="transparent">
<trh:rowLayout width="100%" inlineStyle="background-color:#2461AA" valign="top" >
<trh:cellFormat>
<tr utputText inlineStyle="font-family: Verdana;font-weight:bold; font-size: 10pt; color:#FFFFFF;margin-left:3px" value="Checks" />
</trh:cellFormat>
<trh:cellFormat halign="right" valign="middle">
<tr:commandLink id="CheckDetails" inlineStyle="border-color: thin solid #2461AA" disabled="#{!Provider360FlakesBean.checksDataLoaded}" partialSubmit="false" action="#{Provider360FlakesBean.openChecksDetails}" actionListener="#{Provider360FlakesBean.getAllCheckDetails}" >
<tr:image source="/xAdvisorWeb/images/details.GIF" shortDesc="Details" inlineStyle="background-color:#2461AA;border-color: #2461AA;align: right" />
</tr:commandLink>
</trh:cellFormat>
</trh:rowLayout>
<tr:panelBorderLayout inlineStyle="border-color:#2461AA; overflow: auto;" rendered="#{!Provider360FlakesBean.checksDataLoaded}">
<trh:rowLayout rendered="#{!Provider360FlakesBean.checksDataLoaded}">
<trh:cellFormat>
<tr:spacer width="1"/>
</trh:cellFormat>
<trh:cellFormat halign="center" valign="middle" height="100%">
<trutputText inlineStyle="font-family: Verdana;font-weight:bold; font-size: 12pt; color:Black" value="Loading Checks Data....">
</trutputText>
</trh:cellFormat>
</trh:rowLayout>
</tr:panelBorderLayout>
<tr:panelBorderLayout inlineStyle="border-color:#2461AA; overflow: auto;" rendered="#{Provider360FlakesBean.checksDataLoaded}">
<trh:rowLayout inlineStyle="padding:5px" valign="top">
<trh:cellFormat width="90%" valign="middle" halign="center">
<tr:table width="100%" inlineStyle="background-color: #FFFFFF;" var="checkSummary" value="#{Provider360FlakesBean.checkSummary}" rows="10">
<tr:column align="center" headerText="CheckNo" >
<tr:commandLink action="#{Provider360FlakesBean.openChecksDetails}" actionListener="#{Provider360FlakesBean.setSelectedCheckNo}">
<trutputText inlineStyle="font-family: Arial;font-weight: normal;font-size: 10pt" value="#{checkSummary.checkNo}"></trutputText>
</tr:commandLink>
</tr:column>
<tr:column align="center" headerText="Remit No" >
<tr:commandLink action="#{Provider360FlakesBean.openRemitDetails}" actionListener="#{Provider360FlakesBean.setSelectedRemitNo}">
<trutputText inlineStyle="font-family: Arial;font-weight: normal;font-size: 10pt" value="#{checkSummary.remitNo}"></trutputText>
</tr:commandLink>
</tr:column>
<tr:column align="center" headerText="Amount" >
<trutputText inlineStyle="font-family: Arial;font-weight: normal;font-size: 10pt" value="#{checkSummary.amount}"></trutputText>
</tr:column>
</tr:table>
</trh:cellFormat>
</trh:rowLayout>
</tr:panelBorderLayout>
</tr:panelBox>
</trh:cellFormat>
</trh:rowLayout>
<trh:rowLayout valign="top">
<trh:cellFormat width="100%" height="50%" valign="top">
<tr:commandLink id="contractsdataload" partialSubmit="true" actionListener="#{Provider360FlakesBean.loadContractsData}" />
<tr:inputHidden id="contractsloadStatus" value="#{Provider360FlakesBean.contractsDataLoadStatus}"/>
<tr:panelBox id="contractsPanelBox" partialTriggers="contractsdataload" binding="#{Provider360FlakesBean.contractsPanel}" contentStyle="border: 1px #2461AA solid;width: 230px; height: 170px;valign: top" background="transparent">
<trh:rowLayout width="100%" inlineStyle="background-color:#2461AA" valign="top">
<trh:cellFormat>
<trutputText inlineStyle="font-family: Verdana;font-weight:bold; font-size: 10pt; color:#FFFFFF;margin-left:3px" value="Provider Contracts" />
</trh:cellFormat>
<trh:cellFormat halign="right" valign="middle">
<tr:commandLink id="ContractDetails" inlineStyle="border-color: thin solid #2461AA" disabled="#{!Provider360FlakesBean.contractsDataLoaded}" action="#{Provider360FlakesBean.openContractList}" actionListener="#{Provider360FlakesBean.getAllContractsList}">
<tr:image source="/xAdvisorWeb/images/details.GIF" shortDesc="Details" inlineStyle="background-color:#2461AA;border-color: #2461AA;align: right"/>
</tr:commandLink>
</trh:cellFormat>
</trh:rowLayout>
<tr:panelBorderLayout inlineStyle="border-color:#2461AA; overflow: auto;" rendered="#{!Provider360FlakesBean.contractsDataLoaded}">
<trh:rowLayout rendered="#{!Provider360FlakesBean.contractsDataLoaded}">
<trh:cellFormat>
<tr:spacer width="1"/>
</trh:cellFormat>
<trh:cellFormat halign="center" valign="middle" height="100%">
<trutputText inlineStyle="font-family: Verdana;font-weight:bold; font-size: 12pt; color:Black" value="Loading Contracts Data....">
</trutputText>
</trh:cellFormat>
</trh:rowLayout>
</tr:panelBorderLayout>
<tr:panelBorderLayout inlineStyle="border-color:#2461AA; height: 148px; overflow: auto;" rendered="#{Provider360FlakesBean.contractsDataLoaded}">
<trh:rowLayout inlineStyle="padding:5px" valign="top">
<trh:cellFormat width="90%" valign="middle" halign="center">
<tr:table width="100%" inlineStyle="background-color: #FFFFFF;" var="contracts" value="#{Provider360FlakesBean.providerContracts}" rows="8">
<tr:column align="center" headerText="Contract#" noWrap="false">
<tr:commandLink action="#{Provider360FlakesBean.openContractList}" actionListener="#{Provider360FlakesBean.setSelectedContractNo}">
<trutputText inlineStyle="width:70px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; float: left;font-family: Arial;font-weight: normal;font-size: 10pt" value="#{contracts.contractNo}" truncateAt="5" shortDesc="#{contracts.contractNo}"></trutputText>
</tr:commandLink>
</tr:column>
<tr:column align="center" headerText="Name" noWrap="false">
<trutputText inlineStyle="width:55px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; float: left;font-family: Arial;font-weight: normal;font-size: 10pt" value="#{contracts.contractName}" truncateAt="5" shortDesc="#{contracts.contractName}"></trutputText>
</tr:column>
<tr:column align="center" headerText="Type" noWrap="false">
<trutputText inlineStyle="width:55px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; float: left;font-family: Arial;font-weight: normal;font-size: 10pt" value="#{contracts.type}" truncateAt="5" shortDesc="#{contracts.type}"></trutputText>
</tr:column>
</tr:table>
</trh:cellFormat>
</trh:rowLayout>
</tr:panelBorderLayout>
</tr:panelBox>
</trh:cellFormat>
</trh:rowLayout>
</trh:cellFormat>
</trh:rowLayout>
</trh:tableLayout>
</tr:form>
</trh:body>
</trh:html>
</f:view>
</jsp:root>
******************************************* END **************************
The backing bean methods are as shown below:
public void loadChecksData(ActionEvent ae){
final String METHOD_NAME = "loadChecksData";
final long SLEEP_TIME = 3000;
System.out.println("Called:["+METHOD_NAME+"]");
try{
System.out.println("Sleeping for:["+SLEEP_TIME/1000+"] seconds");
for(int i=0;i<2500;i++){
}
System.out.println("Waking up from sleep ....!!!");
checksDataLoaded = true;
RequestContext context = RequestContext.getCurrentInstance();
Map pageFlowScope = context.getPageFlowScope();
checksData = "1";
pageFlowScope.put(CHECK_LOAD_STATUS, checksData);
checksPanel = new CorePanelBox();
checksPanel.setId("checksPanelBox");
RequestContext.getCurrentInstance ().addPartialTarget(checksPanel);
System.out.println("Added Partial Targets for checks...");
}catch(Exception e){
System.out.println("Exception occured during thread sleeping...");
e.printStackTrace();
}
System.out.println("End of method ...!!!");
}
public void loadContractsData(ActionEvent ae){
final String METHOD_NAME = "loadContractsData";
final long SLEEP_TIME = 6000;
System.out.println("Called:["+METHOD_NAME+"]");
try{
System.out.println("Waiting for:["+SLEEP_TIME/1000+"] seconds");
//Thread.currentThread().wait(SLEEP_TIME);
for(int i=0;i<5000;i++){
}
System.out.println("Waking up from sleep ....!!!");
contractsDataLoaded = true;
RequestContext context = RequestContext.getCurrentInstance();
Map pageFlowScope = context.getPageFlowScope();
contractsDataLoadStatus = "1";
pageFlowScope.put(CONTRACT_LOAD_STATUS, contractsDataLoadStatus);
contractsPanel = new CorePanelBox();
contractsPanel.setId("contractsPanelBox");
RequestContext.getCurrentInstance ().addPartialTarget(contractsPanel);
System.out.println("Added partial trigger for Contracts");
// contractsPanel.setRendered(true);
// contractsPanel.processUpdates(FacesContext.getCurrentInstance());
}catch(Exception e){
System.out.println("Exception occured during thread sleeping...");
e.printStackTrace();
}
System.out.println("End of method ...!!!");
}
[ April 28, 2008: Message edited by: Swami Gopalan ]
[ April 28, 2008: Message edited by: Swami Gopalan ]
[ April 28, 2008: Message edited by: Swami Gopalan ]
|
 |
 |
|
|
subject: Partial page refresh during page onload
|
|
|
0
