[SOLVED] Finding X, Y location of an Element Tag on a page

[ainoy31]

Hello-

 

I need help with my script to find the (x,y) coordinates of an element tag on a page.  Here is my javascript:

function getPos()
{
var elementToFind = document.getElementById('cancelTrigger');
var elementLocs = findPos(elementToFind);
alert(elementLocs[0] + ' ' + elementLocs[1]);
}

function findPos(obj)
{
var curleft = curtop = 0;
if(obj.offsetParent)
{
	curleft = obj.offsetLeft
	curtop = obj.offsetTop

	while(obj = obj.offsetParent)
	{
		curleft += obj.offsetLeft
		curtop += obj.offsetTop
	}
}

return [curleft, curtop];
}

 

 

Here's where I am calling this:

<tr>
<td colspan="*" valign="bottom">
<input type="text" name="future_cancel_date" value="" id="futureCancelDate" readonly="1"> 
<img src="/images-system/ico_date.gif" border="0" id="cancelTrigger" style="cursor: pointer;" title="Date selector" onClick="getPos();">
 <a href="#" onclick="javascript:document.cancelform.future_cancel_date.value=''"><?= $langContent[$section]['clear_cancellation_date'] ?></a>
</td>
</tr>

 

I am able to get the x and y locations such as 152, 722.  My issue is to pass these values in the position option of the Calendar.setup() javascript function as below:

<script type="text/javascript">
Calendar.setup({
inputField     :    "futureCancelDate",    	// id of the input field
ifFormat       :    "<?= str_replace(array('Y', 'y', 'm', 'd'), array('%Y', '%y', '%m', '%d'), $locale->getDateFormat()) ?>",      		// format of the input field
button         :    "cancelTrigger",  	// trigger for the calendar (button ID)
singleClick     :    true,
             position        :    [x, y]  //x=152 and y=722

});

</script>

 

The reason why I need to figure the x,y is because IE is not positioning the popup calendar properly by using the align option.  the popup calendar displays somewhere else but it needs to be next to my calendar icon.  I hope this is easy to follow and understand.  Much appreciation.  AM

 

 

 

[lemmin]

That function accepts the position variable as an array. You should be able to pass it like this:

new Array(152, 722);

[ainoy31]

lemmin-

ok,  if i do alert(elementLocs) in the getPos() function i get my coordinates in an array of [152, 722], which is good.  Either i have been coding too long or something, i still am having an issue passing this array into the Calendar.setup() function for the position option.

[lemmin]

Then you just have to pass elementLocs to Calendar.setup() as the position variable.

[ainoy31]

No.  passing it elementLocs does not work.  i get the error message that there is nothing to setup.  have you use this DHTML calendar widget before?