 |
Web Development »
ASP.NET »
Samples
Advanced
License: The Code Project Open License (CPOL)
Setting Ajax UpdateProgress postition relavent to the source controlBy RaamasArticle explains how to postion the Ajax UpdateProgress control. that relavent to the control that caused the partial post back on the page. |
C# (C#2.0, C#3.0), Javascript, .NET (.NET2.0, .NET3.0), ASP.NET, Dev, Design
|
||||||||||
|
Advanced Search Add to IE Search |
|
|
|
||||||||||||||||
This article gives an idea to use the javascript to find the position of the control on the web page.
you might face the situation like diplaying the Ajax UpdateProgress control while doing the partial post back. this problem I solved in the same type of area.
Here the code snippets provided as two base classes such as positioning the UpdateProgress control at the position of the control that caused the post back on the page, and the second one is postioning the UpdateProgress based on the postion of the Mouse(this might not be the accurate but, in our case we have huge HTML content on the page and the content positioned/visibled based on various conditions).
<head> <script type="text/javascript"> asdffunction Point(x,y) { this.x = x; this.y = y; } mouseLocation = new Point(0,0); var IE = document.all?true:false; if (!IE) document.captureEvents(Event.MOUSEMOVE); document.onmousemove = getMouseLoc; function getMouseLoc(e) { if (IE) { mouseLocation.x = event.clientX + document.body.scrollLeft; mouseLocation.y = event.clientY + document.body.scrollTop; } else { // grab the x-y pos.s if browser is NS mouseLocation.x = e.screenX ; //+ document.body.scrollLeft; mouseLocation.y = e.screenY - 100; //+ document.body.scrollTop; } // catch possible negative values if (mouseLocation.x < 0){mouseLocation.x = 0} if (mouseLocation.y < 0){mouseLocation.y = 0} return true; } /* source : client ID of the control that causes the event target : client ID of the targer UpdateProgress Control to display condition : 0/1 based on the need (0: position based on the Mouse positionn; 1: position based on the source Control position */ function positionDiv(source, target, condition) { var s=document.getElementById(source); var t=document.getElementById(target); if(condition) { if(s.offsetParent) { mouseLocation.x =s.offsetLeft + s.offsetWidth; mouseLocation.y =s.offsetTop; while(s=s.offsetParent) { mouseLocation.x +=s.offsetLeft; mouseLocation.y +=s.offsetTop; } } else { mouseLocation.x=s.offsetLeft; mouseLocation.y =s.offsetTop; } mouseLocation.x=mouseLocation.x - 180; mouseLocation.y=mouseLocation.y - 150; } else { mouseLocation.y = mouseLocation.y - 60; mouseLocation.x = mouseLocation.x - 400; } if(mouseLocation.y <0) mouseLocation.y = 0; if(mouseLocation.x <0) mouseLocation.x = 0; //alert('y :' + mouseLocation.y + ' x:' + mouseLocation.x); t.style.top = (mouseLocation.y) + "px"; t.style.left = (mouseLocation.x) +"px"; t.style.position = "absolute"; } <script> </head>
The Javascript function positionDiv(...) will do everything for positioning the UpdateProgress Control. Not only the UpdateProgress control and also we can make use of this code for any control that you want to display relevant to the source control.
and the code snippet that you need to do in the code behind file (.cs) file looks like the below snippets,
1)for control position
string strValue = String.Format("positionDiv('{0}', '{1}', {2});", btnRefresh.ClientID.ToString(), uprHitList.ClientID.ToString(), 1);
btnRefresh.Attributes.Add("onclick", strValue);
2)Mouse position
string strValue = String.Format("positionDiv('{0}', '{1}', {2});", btnRefresh.ClientID.ToString(), uprHitList.ClientID.ToString(), 0);
btnRefresh.Attributes.Add("onclick", strValue);
in this second case there wont be any impact of the control that we passing as the source because we will consider the mouse position only.
Raamas.
General 
News 
Question 
Answer 
Joke 
Rant 
Admin
Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads.
|
PermaLink |
Privacy |
Terms of Use
Last Updated: 22 May 2008 Editor: Sean Ewington |
Copyright 2008 by Raamas Everything else Copyright © CodeProject, 1999-2010 Web22 | Advertise on the Code Project |
