hi,
Can anyone help...
a Javacript function that defines a particular area as clickable. Once a particular location within the designated area is clicked, it's X and Y co-ordinate is displayed.
What I am then doing is "posting" these form variables to an action page.
This is OK if I define one clickable area with in 1 form, but I want this option to be avaialble to multiple forms within a page so I enclose the clickable area within 1 form and then define a second clickable area with another form all on one page.
When I then try to click a clickable area I get an error message:
"runtime error, 'document.formname.y' is null or not an object"
My programming experience of Javascript is non-existant.... please help..
I have attached the code below:
-------------------------------------------------------------------------------------------
<html>
<head>
<title>Position your choices</title>
</head>
<body>
<style>
.clickablearea{cursor:hand;}
</style>
</head>
<body>
<script>
function mouseMoved()
{
var eobj,thex,they
eobj = window.event
if(eobj.srcElement.className=="clickablearea"
{
thex = eobj.clientX
they = eobj.clientY
document.formname.y.value=thex
document.formname.x.value=they
}
}
document.onclick=mouseMoved
</script>
<form name="formname" ACTION ="previewXYpage.cfm" METHOD="Post" >
<table bgcolor="#COCOCO" cellspacing="1" cellpadding="1" border="2">
<tr>
<td WIDTH=1%><div class="clickablearea">This a clickable row</td></div>
</tr>
</table>
The X Co-Ordinate is <input type="text" name=x><BR>
The Y Co-Ordinate is <input type="text" name=y>
<INPUT TYPE = "Submit" VALUE ="Enter">
<INPUT TYPE = "Reset" VALUE ="Clear">
</FORM>
<form name="formname" ACTION ="previewXYpage.cfm" METHOD="Post" >
<table bgcolor="#COCOCO" cellspacing="1" cellpadding="1" border="2">
<tr>
<td WIDTH=1%><div class="clickablearea">This a clickable row</td></div>
</tr>
</table>
The X Co-Ordinate is <input type="text" name=x><BR>
The Y Co-Ordinate is <input type="text" name=y>
<INPUT TYPE = "Submit" VALUE ="Enter">
<INPUT TYPE = "Reset" VALUE ="Clear">
</FORM>
</body>
</html>
Can anyone help...
a Javacript function that defines a particular area as clickable. Once a particular location within the designated area is clicked, it's X and Y co-ordinate is displayed.
What I am then doing is "posting" these form variables to an action page.
This is OK if I define one clickable area with in 1 form, but I want this option to be avaialble to multiple forms within a page so I enclose the clickable area within 1 form and then define a second clickable area with another form all on one page.
When I then try to click a clickable area I get an error message:
"runtime error, 'document.formname.y' is null or not an object"
My programming experience of Javascript is non-existant.... please help..
I have attached the code below:
-------------------------------------------------------------------------------------------
<html>
<head>
<title>Position your choices</title>
</head>
<body>
<style>
.clickablearea{cursor:hand;}
</style>
</head>
<body>
<script>
function mouseMoved()
{
var eobj,thex,they
eobj = window.event
if(eobj.srcElement.className=="clickablearea"
{
thex = eobj.clientX
they = eobj.clientY
document.formname.y.value=thex
document.formname.x.value=they
}
}
document.onclick=mouseMoved
</script>
<form name="formname" ACTION ="previewXYpage.cfm" METHOD="Post" >
<table bgcolor="#COCOCO" cellspacing="1" cellpadding="1" border="2">
<tr>
<td WIDTH=1%><div class="clickablearea">This a clickable row</td></div>
</tr>
</table>
The X Co-Ordinate is <input type="text" name=x><BR>
The Y Co-Ordinate is <input type="text" name=y>
<INPUT TYPE = "Submit" VALUE ="Enter">
<INPUT TYPE = "Reset" VALUE ="Clear">
</FORM>
<form name="formname" ACTION ="previewXYpage.cfm" METHOD="Post" >
<table bgcolor="#COCOCO" cellspacing="1" cellpadding="1" border="2">
<tr>
<td WIDTH=1%><div class="clickablearea">This a clickable row</td></div>
</tr>
</table>
The X Co-Ordinate is <input type="text" name=x><BR>
The Y Co-Ordinate is <input type="text" name=y>
<INPUT TYPE = "Submit" VALUE ="Enter">
<INPUT TYPE = "Reset" VALUE ="Clear">
</FORM>
</body>
</html>
