Don't you hate it when you are idle on a web app for just a bit too long, and your membership session gets timed out without warning? Your users sure do! Often times the user may not even realize he has been timed out until he finishes completing a form, and clicks the submit button. At which time not only has the user lost his session, he has lost his data too.
In this post, I will provide a custom control, complete with source code, which will improve this experience for your users by displaying a nice message to inform them that their session is about to expire. It will do this without any popups or postbacks by using the ASP.NET AJAX framework. Download the control, and source code, here.
Implementation is easy. Just add the control to your Visual Studio toolbox, and drag it on to your master page wherever you would like the message to appear. Set the properties to your situation and enter markup into the template section as seen here:
<tsc:Timeout
ID="Timeout1"
runat="server"
Enabled="true"
AboutToTimeoutMinutes="28"
TimeoutMinutes="30"
TimeoutURL="~/Default.aspx?timeout=true"
CssClass="timeout"
DisplayButton="false"
ButtonCssClass="btn"
ButtonText="Continue My Session!"
>
<Template>
For your safety and protection, your session is about to expire. If you wish to continue your session, please click here.</Template>
</tsc:Timeout>
This control needs the ASP.NET AJAX framework to be included in your project. It will also require a Script Manager control. Following is a description of each property
- Enabled - Whether the control is enabled or not. I typically place the control on a master page, and set the enabled property in code behind based on whether the user is logged in or not. If they are not logged in, they can't very well timeout can they?
- AboutToTimeoutMinutes - Idle minutes until the user is informed that their session is about to time out.
- TimeoutMinutes - Idle minutes until the membership session will time out. This should match the forms authentication timeout property in the web.config.
- TimeoutURL - URL to redirect the user, in the event of a membership session timeout
- CssClass - CSS class name applied to the control
- DisplayButton - Whether the button is visible. If this is false, the entire control is clickable by the user to restore their session.
- ButtonCssClass - CSS class name applied to the button control
- ButtonText - The text to be displayed on the button
- Template - Enter your html or asp.net markup here. This is the message that will be displayed when the user's membership session is about to timeout.
Enjoy, and please post here if you see any room for improvement in the source. This is my first attempt at a AJAX enabled custom control. Download the control, and source code, here.