...

View Full Version : Use text to submit a form using JS?



SteveH
07-24-2012, 08:20 AM
Hello

I have a 'test' page here:

http://www.proofreading4students.com/register.asp

Users normally click on the 'Enter' or 'Reset' images on this form, but I was hoping to change those buttons to text links using JS (you can see my little experiment above the normal log-in).

The JS I am using, which doesn't seem to work, is:


<form name="Login">
<input type=text name="formInput">

<a href="javascript:document.Login.submit();">Enter</a>

<a href="javascript:document.Login.reset();">Reset</a>

</form>


Any advice, please?

VIPStephan
07-24-2012, 10:25 AM
Besides the terrible practice of putting inline JS in the href attributes the form above has nothing to submit it to (i. e. no action attribute).

SteveH
07-24-2012, 12:50 PM
Hello

Thanks for your reply, Stephen.

This is what I have at the moment:


<form name='Login' method='post' action='register.asp?mode=add' onSubmit='return invalid()'>

The 'add' refers to a new user being added to an online database when the 'Submit' button is pressed.

Towards the bottom of the form I have this:


<input type='image' src='images/forward_16.gif' name='Submit' value='Enter' alt='Enter'>

<input type='image' src='images/cancel_16.gif' name='Reset' value='Reset' alt='Reset'>

I would like to replace these two images with [Enter] and [Reset] and thought JS may do it presumably using the first snippet of code above, but I am unsure how to put it together.

Steve

Old Pedant
07-24-2012, 09:12 PM
<input type="image"> *IS* a submit button. Did you never try your current "X" that supposedly resets? It actually *SUBMITS* instead!


But if you really want just text, *USE* the proper button types:


<input type="submit" value="Enter" />
<input type="reset" value="Reset" />


I don't know why this wouldn't work, though:


<form name="Login">

<a href="#" onclick="document.Login.submit();return false;">Enter</a>
<a href="#" onclick="document.Login.reset();return false;">Reset</a>

</form>

CAUTION: When you call submit() directly, you BYPASS the onsubmit= of the <form> tag.

SteveH
07-24-2012, 10:19 PM
Hello Old Pedant

That worked as in
<form name='Login' method='post' action='register.asp?mode=add'>

HTML tables here

<tr>
<td align='right' height='44' width='94'>&nbsp;</td><td height='44 width='172'>

<a href="#" onclick="document.Login.submit();return false;">[Enter]</a>
<a href="#" onclick="document.Login.reset();return false;">[Reset]</a>

</td></tr></table></form>

So thank you ! :thumbsup:

VIPStephan
07-24-2012, 10:54 PM
Now that OldPedant pointed it out: You could still use regular input elements and style them with CSS to look like plain text.


input[type=submit], input[type=reset] {
border: none;
padding: 0;
background: none;
cursor: pointer;
color: blue;
text-decoration: underline;
}

That’s actually better than using JS which can be disabled or might not be available, making your links useless.

SteveH
07-24-2012, 11:11 PM
Many thanks for your reply, Stephen.

Much appreciated.

Steve



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum