Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Client-side Scripting _ submitting with a hotspot

Posted by: slickchris7777 Mar 19 2012, 11:58 AM

I'm using this code on my page

<form method="post" id="e0" class="seagreen-form" action="/subscription.php/confirm" onsubmit="return Sg.validate(this);" enctype="multipart/form-data">
<input name="_tkn" type="hidden" value="4f675e24bc5a99.04808583" />

<input id ="e1" name ="email" type="text" style="position: absolute; top:307px; width:300px; height:40px; left: 935px;" maxlength="256"/>


<script language="Javascript" type="text/javascript">addFieldToCheck("email","Email");</script></td></tr><input type="hidden" name="htmlemail" value="1">

<map name="Map" id="Map">
<area shape="rect" coords="586,241,845,344" alt="join now" type="submit" name="submit" id="e2" onClick="java script:document.form.submit();" nohref />
</map>

</form>

This code would work fine if I use a button like so:

<button id="e2" name="submit" type="submit">Submit</button>

However, it does not work with the hotspot, how can I get the hotspot to do the same thing.

Posted by: Darin McGrew Mar 19 2012, 12:39 PM

This is about JavaScript, not markup, so I moved it to the client-side scripting forum.

Posted by: pandy Mar 19 2012, 02:13 PM

QUOTE(slickchris7777 @ Mar 19 2012, 05:58 PM) *

<area shape="rect" coords="586,241,845,344" alt="join now" type="submit" name="submit" id="e2" onClick="java script:document.form.submit();" nohref />


First, you don't need the javascript bit. It's something that was used before eventhandlers like onclick were available, and it was used as the value of href. Never ever use it.

Secondly, you can't refer to the form with just 'form'. Either you need to give FORM an name or an id and refer to it using that, or you can use the built in forms collection that JavaScript creates of all the forms on the page. Provided this form is either the only form or the first form on the page it would have the index '0' (JavaScript counts from zero, so the first is 0, the second is 1 and so on).

CODE
<area href=""... onclick="document.forms[0].submit(); return false">


You need the return false that will kill the href action. Without it both the href and the onclick will be acted on. You can't leave the href out or most (no?) browsers will make the area clickable.

Posted by: Christian J Mar 19 2012, 02:15 PM

CODE
</tr><input type="hidden" name="htmlemail" value="1">

The above looks like invalid HTML (should the INPUT element and the rest of the form be inside the table?).

CODE
onClick="java script:document.form.submit();" nohref />

document.form.submit() above assumes that there's a form named "form".

Note also that the submit() method appears to circumvent the onsubmit event in the FORM start tag.

Posted by: pandy Mar 19 2012, 02:19 PM

OK, I see now that you use nohref. That works, but you need to style the area with cursor: pointer so it shows the right mouse pointer and that won't work in older versions of IE - I think it works in newer.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)