Win a copy of Design for the Mind this week in the Design forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Where to invoke AJAX code to ask user if they want to extend session?

 
Steven Gray
Greenhorn
Posts: 8
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I am a newbie to AJAX. I want to prompt a user before their session is invalidated so they can stay logged in. I have seen an example online for jsp:
Update User's Session With Ajax
I am trying (unsuccessfully) to adapt this for use in a MyFaces application.
My question is where should I place the JavaScript code to start the timer. Should it be in the page header like Eric has in his example?
<html>
<head>
<title>sessionTimeout</title>
<script type="text/javascript" src="SessionWarningTimer.js"></script>
</head>
<body>
<form id="Form1" method="post">
</form>
</body>
</html>

Or should it be invoked from a body onload tag:
<BODY onLoad="SessionWarningTimer.js">

Or should it be invoked using a Phase Listener. If so, what phase?

Thanks in advance.


 
Tim Holloway
Saloon Keeper
Pie
Posts: 18094
48
Android Eclipse IDE Linux
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Phase listener won't help. Phase listeners run on the server, and you need action on the client.

Typically, you'd place the Javascript code definition in the header (or on an external reference). However, to actually run the JavaScript, you need to attach it to the onload event or something similar. You've made the mistake of confusing the definition with the execution.
 
Steven Gray
Greenhorn
Posts: 8
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I think I see what you mean, but as I am progressing on this, I have another question. I am creating a JSF custom UI component that the user can drop onto their web page. Basically I want it to prompt the user every N minutes if they want to extend their session. If they answer yes, it extends the session and writes a message to the web page where the component has been placed on the page. I have the code working correctly that generates the Java Script on the page. But I need to know how to "kick off" the Javascript code when the page is being displayed for the first time. Here is what I end up with when the component is created:

<td >
<span id="_id1:sessionStatus" class="StatusMessage"></span>
<script type="text/javascript">
var reqXML;
function LoadXMLDocurl){
if (window.XMLHttpRequest){ //Mozilla, Firefox, Opera 8.01, Safari
reqXML = new XMLHttpRequest();
reqXML.onreadystatechange = BuildXMLResults;
reqXML.open("GET", url, true);
reqXML.send(null);
}
else if(window.ActiveXObject){ //IE
reqXML = new ActiveXObject("Microsoft.XMLHTTP");
if (reqXML) {
reqXML.onreadystatechange = BuildXMLResults;
reqXML.open("GET", url, true);
reqXML.send();
}
}
else{ //Older Browsers
alert("Your Browser does not support Ajax!");
}
} function BuildXMLResults(){
if(reqXML.readyState == 4){ //completed state
if(reqXML.status == 200){ //We got a success page back
alert(reqXML.responseText);
if(reqXML.responseText.indexOf("Session Updated - Server Time:") >= 0){
//window.status = reqXML.responseText; //display the message in the status bar
SetTimer(); //restart timer
}
else{
alert(reqXML.responseText);
//display that that session expired
alert("Your session appears to have expired. You may loose your current data.");
}
}
else{
//display server code not be accessed
alert("There was a problem retrieving the XML data:
" + reqXML.statusText);
}
}
}
function ConfirmUpdate(){
//Ask them to extend
if(confirm("Your session is about to expire. Press 'OK' to renew your session.")){
//load server side page if ok
LoadXMLDoc('sessionUpdater.jsp');
}
}
var timerObj;
function SetTimer(){
//How long before timeout (should be a few minutes before your server's timeout
var dblMinutes = 1;
//set timer to call function to confirm update
timerObj = setTimeout("ConfirmUpdate()",1000*2*dblMinutes);
}
//start the timer
SetTimer();
</script>
</td>

I realize this code is not 100% correct yet. For example, I will have to change the following line in the function BuildXMLResults to write something to the JSF page.
window.status = reqXML.responseText;

My question is how do I modify my JSF custom code to automatically run the Javascript code I generated?

The examples I have seen attach the Javascript to something like the "onkeyup" event for an Input Text Box. In my case, I want the code to start automatically when the page opens. Any suggestions? Thank you In Advance.
 
Tim Holloway
Saloon Keeper
Pie
Posts: 18094
48
Android Eclipse IDE Linux
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Helpful hint: if you use the "Code" button in the message editor, it will wrap special tags around your code (or XML or whatever) that keep it from being reformatted.

JavaScript doesn't bind directly to JSF, since JSF is server-side and JavaScript is client-side. However, you can use AJAX to send JavaScript data to the JSF server - and vice versa. That can be done by manually coding your own AJAX javascript or by using the new JavaScript services in JSF2 or by using an AJAX-enables extension tagset such as RichFaces.

One thing to keep in mind, however, is that whatever session timer you use is going to have to be your own. The countdown timer on the J2EE HttpSession object is reset every time a request comes in, and it doesn't distinguish between "normal" requests and AJAX requests, so the mere act of polling the JSF webapp will restart the countdown!
 
Steven Gray
Greenhorn
Posts: 8
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi Tim,
I solved my problem! My custom JSF component was successfully generating the JavaScript, but I did not think the JavaScript was executing. After some detailed digging,
I discovered a subtle typo in the JavaScript I was generating. I fixed the typo and it started working. Thanks for your help!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic