PDA

Click to See Complete Forum and Search --> : Can't get input type="image" to work

guysmily
10-29-2003, 10:46 AM
Hello group, I can't seem to get this work. It's supposed to do this:

* user clicks on image and the X and Y coords are concatenated into a string as "X,Y," etc.
* Then, the value is appended to the value in the text area.

So for example, if the user clicks in 3 different spots, the text area will have something simalar to:
124,71,135,78,199,92,

But what's happening is that every time the user clicks, the form seems to 'submit' and the text area clears out. I know that the default event of the input image type is submit,
but I can't even get it to work using the image with a href tag and "OnClick"

Please help.

Thanks.

Here's the code:

<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript">
<!--
// <!--

function detect_mouse(field,x,y) {

var fv = field.value;
var test = fv + x + "," + y + ",";
field.value = fv + x + "," + y + ",";

}


//-->
</script>
</head>

<body bgcolor="#CCCCCC" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<form>
<input type="image" src="image/C1.gif" width="300" height="300" onClick="detect_mouse(this.form.TheTextArea,event.clientX,event.clientY);">
<br>

<textarea name="TheTextArea" cols="50" rows="15"></textarea>
</form>
</body>
</html>
gil davis
10-29-2003, 10:53 AM
Originally posted by guysmily
<form>
<input type="image" src="image/C1.gif" width="300" height="300" onClick="detect_mouse(this.form.TheTextArea,event.clientX,event.clientY);"><br>
<textarea name="TheTextArea" cols="50" rows="15"></textarea>
</form>
Try this:
<form onSubmit="return false">
<input type="image" ... onClick="detect_mouse(this.form.TheTextArea,event.clientX,event.clientY);return false">
guysmily
10-29-2003, 11:08 AM
Gil,

Wow, I feel stupid. Works like a charm!

Thanks!

Guy :D
guysmily
10-29-2003, 11:20 AM
One, question, what if I wanted to actually submit the form when the text area has the data I need?

Is there a way to do that?
gil davis
10-29-2003, 11:33 AM
<input type="button" onclick="this.form.submit()" value="Submit">
Believe it or not, the submit() function does not trigger the onSubmit event.
guysmily
10-29-2003, 12:03 PM
Thanks Gil.

It works like a charm (again).

Guy