Form with a link instead of a button

[John Smith]

I am working on fixing a web site made by someone else. They asked me to
make some text into a link, but the problem is that I cannot use a standard
link because the link needs to post form data.

I can do this with a graphic:

<form METHOD="POST"
ACTION="http://www.availabilityonline.com/availtable.asp" ID="form1"
NAME="form1">
<input type="image"
src="http://www.harborresort.com/menu/m10.gif" id="SUBMIT1" name="SUBMIT1">
<input TYPE="HIDDEN" NAME="un" VALUE="harborresort"></form>

But is there a way to do it with a simple text link?

I just want text to say "Online Reservations" without having to use an image
to post the form data.


Thanks,
Kevin

 

[Richard]

I am working on fixing a web site made by someone else. They asked me
to
make some text into a link, but the problem is that I cannot use a
standard
link because the link needs to post form data.

I can do this with a graphic:

<form METHOD="POST"
ACTION="http://www.availabilityonline.com/availtable.asp" ID="form1"
NAME="form1">
<input type="image"
src="http://www.harborresort.com/menu/m10.gif" id="SUBMIT1"
name="SUBMIT1">
<input TYPE="HIDDEN" NAME="un"
VALUE="harborresort"></form>

But is there a way to do it with a simple text link?

I just want text to say "Online Reservations" without having to use an
image
to post the form data.

Thanks,
Kevin

Why not use a simple checkbox or a "go" button?

 

[John Smith]

They specifically requested a link. I could easily do that, ,but I was
trying to make them happy.

Kevin

 

[Steve Pugh]

I am working on fixing a web site made by someone else. They asked me to
make some text into a link, but the problem is that I cannot use a standard
link because the link needs to post form data.

I can do this with a graphic:

<form METHOD="POST"
ACTION="http://www.availabilityonline.com/availtable.asp" ID="form1"
NAME="form1">
<input type="image"
src="http://www.harborresort.com/menu/m10.gif" id="SUBMIT1" name="SUBMIT1">
<input TYPE="HIDDEN" NAME="un" VALUE="harborresort"></form>

But is there a way to do it with a simple text link?

I just want text to say "Online Reservations" without having to use an image
to post the form data.

1. Use CSS to style a button so that it looks like an ordinary link.
There are limits on how far you can style form elements in many
browsers but you can get close in most modern browsers.
e.g.
..submit {margin: 0; border: none; padding: 0; background: inherit; ...
font styles if needed ... and so on ...}
<input type="submit" class="submit" value="Online Reservations">

2. Use JavaScript to submit the form when a link is clicked, but make
sure that (a) the link doesn't appear when JS is disabled (i.e. the
link is included in the page via document.write or DOM manipulation)
and (b) a standard submit button is included when JS is disabled (i.e.
via <noscript>).

Option 1 is less work and more robust but may not give 100% of the
desired visual presentation in all browsers.

Steve

 

[saz]

1. Use CSS to style a button so that it looks like an ordinary link.
There are limits on how far you can style form elements in many
browsers but you can get close in most modern browsers.
e.g.
.submit {margin: 0; border: none; padding: 0; background: inherit; ...
font styles if needed ... and so on ...}
<input type="submit" class="submit" value="Online Reservations">

2. Use JavaScript to submit the form when a link is clicked, but make
sure that (a) the link doesn't appear when JS is disabled (i.e. the
link is included in the page via document.write or DOM manipulation)
and (b) a standard submit button is included when JS is disabled (i.e.
via <noscript>).

Option 1 is less work and more robust but may not give 100% of the
desired visual presentation in all browsers.

Steve

There also comes a time when you need to tell the client that what they
want can't be done.

 

[Richard]

They specifically requested a link. I could easily do that, ,but I was
trying to make them happy.

Ok. Try this idea on them.
Do the button thing. Put it in a transparent gif.
When you mouseover the image, make it look like it's been highlighted as you
do with text.

 

[Disco Octopus]

Steve Pugh wrote :

1. Use CSS to style a button so that it looks like an ordinary link.

this site does just that....

http://aussiesurveys.com.au

on the left where the user logs in. looks like in opera it still
appears to be a button (raised) but moz and IE looks ok.

 

[Richard]

Steve Pugh wrote :

this site does just that....

on the left where the user logs in. looks like in opera it still
appears to be a button (raised) but moz and IE looks ok.

i didn't see anything in the source code that looked like a <form> tag.
All links outside of the menu bar pointed to the survey site thing.

 

[Toby Inkster]

i didn't see anything in the source code that looked like a <form> tag.

So this bit entirely passed you by?

<form name="login" method="post"
action="/members/members.php?action=checklogin"
style="padding:0px;margin:0px;">
<table class="menusection" cellpadding="0" cellspacing="0"
border="0" style="width:100%;">
<tr>
<td class="menutext">RETURNING CUSTOMERS</td>
</tr>
<tr>
<td class="menutext">Email Address:</td>
</tr>
<tr>
<td><input class="menuinput" type="text" name="email"
size="20"></td>
</tr>
<tr>
<td class="menutext">Password:</td>
</tr>
<tr>
<td><input class="menuinput" type="password" name="pword"
size="20"></td>
</tr>
<tr>
<td><input class="menubutton" type="submit" value="Enter"></td>
</tr>
</table>
</form><br>

Did you even *look* at the source code?

 

[barreled]

Just found this thread via Google, here's a simple workaround that I use:

<input type="submit" value="Submit" style="Border: none; background: none">