My First jQuery Plugin

There is my first jQuery plug-in that useful for image jquery cycle plug-in

تعليقات

Session timeout notifcation - cont.

After writing previous post I figured that this message style work fine with normal page post back but when it comes for using asp.net ajax controls this functionality does not work until a real page post back happens   so you I figured that we need a special operation that update time status every time an ASP.Net Ajax happens so we need to add following code inside our page (Master page of-course  after script manager control)

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(Request_End);
function Request_End(sender, args)
{
//$.unblockUI();
clearTimeout(mainTimer);
clearTimeout(subTimer);
mainTimer = setTimeout(”SessionTimeoutMessage(sessionTimeOut, limit)”, (sessionTimeOut - limit) * 1000);

}

Code explaination:

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(Request_End);

get a reference of the page request manager and add to page end request event a custom function. for more details about this object you can visit following link:

http://www.asp.net/AJAX/Documentation/Live/ClientReference/Sys.WebForms/PageRequestManagerClass/default.aspx

inside our method we clear old timer and then call our old friend that trigger session counter to run from the beginning again and again on every AJAX call

very useful .net user control

In past days while I’m looking for new user controls that can help to save my time from writing jQuery user controls and using jQuery plugins I found a very interesting controls that make my jQuery coding and usage very easy and faster than ever. and the most great thing the ability to attache any .jQuery plugin in very easy steps that you can find on this user controls web site www.dotnetage.com  ( OpenSource)

!

تعليقات

Session timeout notifcation

During my work as web developer many time I face session timeout issue with end user where most of theme to make some kind of notification to notifay the end user when his/her session will expire so they can harry-up there data entry or to save data entry that they are doing, so I decide to write simple java script coding to notifay my end users before session expire in couple minutes , and to reach this soultion we just need to add following code into our secure pages:

protected int SessionTimeout
{
get
{
//retrive current user autehnticatd
DateTime sessionExpireDate = System.Web.Security.FormsAuthentication.Decrypt(Request.Cookies[System.Web.Security.FormsAuthentication.FormsCookieName].Value).Expiration;
TimeSpan differance = sessionExpireDate.Subtract(DateTime.Now);
return (int)differance.TotalMinutes;
}
}

<script type=”text/javascript” language=”javascript”>
var sessionTimeOut = <%= SessionTimeout %>;
var limit = 1;
var subTimer;
setTimeout(”SessionTimeoutMessage(sessionTimeOut, limit)”, (sessionTimeOut - limit) * 60 * 1000);

function SessionTimeoutMessage(sessionTimeOut, limit)
{
$.blockUI({
message: $(’div.growlUI’),
fadeIn: 700,
fadeOut: 700,
timeout: limit * 60000 + 100,
showOverlay: false,
centerY: false,
css: {
width: ‘350px’,
top: ‘10px’,
left: ”,
right: ‘10px’,
border: ‘none’,
padding: ‘5px’,
backgroundColor: ‘red’,
‘-webkit-border-radius’: ‘10px’,
‘-moz-border-radius’: ‘10px’,
opacity: .6,
color: ‘#fff’
}

});
subTimer = setTimeout(”counter(limit * 60)”, 1);

}
function counter(limit)
{
var timerValue = limit;
if(timerValue < 0)
{
//alert(”Zero”);
clearTimeout(subTimer);
return;
}
//alert(timerValue);
$(’div#timer’).text(timerValue –);
subTimer = setTimeout(”counter(timerValue)”, 1000);
}

</script>

and inside our page body we add following div that contain our message:

<div class=”growlUI” style=”display: none;”>
<strong>Notification</strong> Dear user please note that your session will expire within
<div id=”timer”></div>seconds;
</div>

enjoy it ;)

تعليقات

Transfer Post Back Event Result into new page

Some time when you develop in you project your customer or you want to generate some data based on post back event to show-up int new window without changing current page state so you have 2 common  solution

1st mostly used you create a third page that handle your postback data based on passed parameters or to create page for every report on such action which sucks.

2ed option to use some of  javascript coding as in following steps:

first we create an html page that display wait message pleaswait.htm

2ed create helper method GetButtonScript(); that generate and return button new post back script.

private string GetPrintButtonScript(Button btn)
{
StringBuilder printButtonScript = new StringBuilder();

//get the postback script
string postBackScript = Page.ClientScript.GetPostBackEventReference(btn, “”);

//Change target to a new window. Name the window current date and time to
//allow multiple windows can be opened
printButtonScript.Append(”var today = new Date();”);
printButtonScript.Append(”var newWindowName = today.getFullYear() + ” + today.getMonth() + ” + today.getDate()+ ” + today.getHours()+ ” + today.getMinutes()+ ” + today.getSeconds()+ ” + today.getMilliseconds();”);
printButtonScript.Append(”document.forms[0].target = newWindowName;”);

//Show waitting screen
printButtonScript.Append(”window.open(’../Reports/PleaseWait.htm’, newWindowName, ’scrollbars=yes,status=no, resizeable=yes’);”);

//Reset target back to itself so other controls will post back to this form
printButtonScript.Append(postBackScript + “;”);
printButtonScript.Append(”document.forms[0].target =’_self’;”);
printButtonScript.Append(”return false;”+ Environment.NewLine);

return printButtonScript.ToString();
}

}

and to use it you just add following code into page load

protected void Page_Load(object sender, EventArgs e)
{
Button1.Attributes.Add(”onclick”, GetPrintButtonScript(Button1));
}

تعليقات