Solved

How to get the cordinates (X,Y) of a asp:button when nothing is specified in style attribute.

Posted on 2004-08-23
14
258 Views
Last Modified: 2008-02-01
How to get the cordinates (X,Y) of a asp:button when nothing is specified in style attribute. The thing is i have placed a button in a table cell where i can't specify the top & left attributes in style. Now i want to show a tab stip beside the button when clicked.please help
its very urgent..........
with regards
thanx in advance
shwetabh

0
Comment
Question by:shwetabh4u
14 Comments
 
LVL 8

Expert Comment

by:shovavnik
ID: 11867866
Keep in mind that this all has to be client-side, as the the server can't know the position of the mouse event which doesn't throw a post back event.
Assuming the id of your button is "MyButton", and your tab strip "MyTabStrip", you can try something like the following.  

<head>
<script for="MyButton" event="onclick">
var buttonX, buttonY;
function getButtonXY() {
var button = document.all[ 'MyButton' ];
if( button != null ) {
  buttonX = button.style.pixelTop;
  buttonY = button.style.pixelLeft;
  document.all[ 'MyTabStrip' ].style.display = 'block';
  document.all[ 'MyTabStrip' ].style.visibility = 'visible';
  document.all[ 'MyTabStrip' ].style.pixelLeft = buttonX + 100;
  document.all[ 'MyTabStrip' ].style.pixelTop = buttonY;
}
</script>
</head>

Depending on your implementation, you may want to try using posTop and posLeft instead of pixelTop and pixelLeft.
You might also want to try offsetTop and offsetLeft if these don't give you enough info (if you need to calculate the position offscreen, for example).

Links:
pixelLeft: http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/pixelleft.asp
posLeft: http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/posleft.asp
offsetLeft: http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/offsetleft.asp
0
 

Author Comment

by:shwetabh4u
ID: 11868326
thanx for quick response but i don't have use client side. is there any other way thru which i can do it thru code behind
with regards
shwetabh
0
 
LVL 5

Expert Comment

by:Kelmen
ID: 11868441
If you wanna show something beside/near the button click, you may do it when postback (button clicked), setup a flag, and/or call a routine to display the stuff near the object?
0
Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

 
LVL 8

Expert Comment

by:shovavnik
ID: 11868982
You can set it up a bit differently.

In each table cell, put the stuff you want next to the button, and set the Visible property to False.
On post back, determine what row you're in, and set the visible property of the object next to the button on that row to true.

To determine what row you're in, you have several possibilities.  I think the simplest is to set the value of the CommandArgument of the button you use to the row index.
0
 
LVL 17

Expert Comment

by:AerosSaga
ID: 11869358
just use a javascript to get x and y:

<!-- ONE STEP TO INSTALL MOUSE COORDINATES:

  1.  Copy the coding into the BODY of your HTML document  -->

<!-- STEP ONE: Paste this code into the BODY of your HTML document  -->

<BODY>

<form name="Show">
X <input type="text" name="MouseX" value="0" size="4"><br>
Y <input type="text" name="MouseY" value="0" size="4"><br>
</form>

<script language="JavaScript1.2">
<!-- Original:  CodeLifter.com (support@codelifter.com) -->
<!-- Web Site:  http://www.codelifter.com -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
var IE = document.all?true:false;
if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
var tempX = 0;
var tempY = 0;
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft;
tempY = event.clientY + document.body.scrollTop;
}
else {  // grab the x-y pos.s if browser is NS
tempX = e.pageX;
tempY = e.pageY;
}  
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}  
document.Show.MouseX.value = tempX;
document.Show.MouseY.value = tempY;
return true;
}
//  End -->
</script>

<p><center>
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size:  1.33 KB -->

Regards,

Aeros
0
 
LVL 8

Expert Comment

by:shovavnik
ID: 11869446
Aeros,

The problem is that he wants to display a control on the server-side using the client-side mouse position.
0
 

Author Comment

by:shwetabh4u
ID: 11889924
ok friends thanx alots 4 all your efforts.but i am not allowed to use client-side. Actually i have use it at so many places so even i cant go 4 the placing the same things in different table cell(in invisibale mode). looks if i have the control on our form so there must be some way thru which we can get its location......sorry for bothering u all but plz help me once again.
thanx once again
regards
shwetabh
0
 
LVL 8

Expert Comment

by:shovavnik
ID: 11890504
Try the following code:

If you know the index of the row in which you want to add the control right away, you can put this in Page_Load:

int newPositionRowIndex = 1; // figure out the row in which you need to put the control here
Control myMovingControl = Page.FindControl( "MyMovingControl" );
myMovingControl.Parent.Controls.Remove( myMovingControl )
myDataGrid.Items[ newPositionRowIndex ].Cells[ 0 ].Controls.Add( myMovingControl );

If not, then you can put this code in the ItemCommand event handler (or whatever handler you use).  In that case, you can figure out the index by using the eventargs parameter to access the cell directly:

Control myMovingControl = Page.FindControl( "MyMovingControl" );
myMovingControl.Parent.Controls.Remove( myMovingControl )
e.Item.Cells[ 0 ].Controls.Add( myMovingControl );
0
 

Author Comment

by:shwetabh4u
ID: 11900043
hello shovavnik
great effort....but dear i  dont have to place my control in the cell....it ll increase my cell hieght(the control is tab strip) i have to show it as popup.
regards
shwetabh
0
 
LVL 8

Expert Comment

by:shovavnik
ID: 11900494
Ok.  So here's a summary:

You want to display a popup next to whichever control was clicked.
You can't use javascript, as Aeros suggested.
You can't place the control inside your cell.
You can't specify anything in the style attribute (I guess you're flow layout).

Can you use a css file?  This may a be a good alternative to using a style attribute.  Note that if you already use css, you can *add* css classes:
<div id="testing" css="class1 class2 class3">testing</div>

Basically, you've eliminated all the reasonable methods to get the x,y position, including positioning without the actual values.

Maybe you should reconsider some of your limitations?  Are you sure you can't use javascript?  If it's a problem of cross-browser compatibility, then we can concoct a cross-browser script.

Are you sure you can't set the style attribute?  If you can, it can be set either on the client or on the server (if javascript is allowed).

Can you place the control in your cell, and give the cell an overflow style (in css) that will prevent the cell from resizing?

You've gotta help us help you.
0
 
LVL 8

Accepted Solution

by:
shovavnik earned 500 total points
ID: 12154252
I believe I should be awarded the points as I've made every reasonable effort to solve the issue at hand.

The author hasn't responded to my final query which sums up the difficulty of this question and offers some more solutions.
0

Featured Post

PRTG Network Monitor: Intuitive Network Monitoring

Network Monitoring is essential to ensure that computer systems and network devices are running. Use PRTG to monitor LANs, servers, websites, applications and devices, bandwidth, virtual environments, remote systems, IoT, and many more. PRTG is easy to set up & use.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

User art_snob (http://www.experts-exchange.com/M_6114203.html) encountered strange behavior of Android Web browser on his Mobile Web site. It took a while to find the true cause. It happens so, that the Android Web browser (at least up to OS ver. 2.…
Introduction This article shows how to use the open source plupload control to upload multiple images. The images are resized on the client side before uploading and the upload is done in chunks. Background I had to provide a way for user…
This video shows how to use Hyena, from SystemTools Software, to bulk import 100 user accounts from an external text file. View in 1080p for best video quality.
Email security requires an ever evolving service that stays up to date with counter-evolving threats. The Email Laundry perform Research and Development to ensure their email security service evolves faster than cyber criminals. We apply our Threat…

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question