# HTML Help: Buttons that link and the people who want them

**URL:** https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428
**Category:** Factual Questions
**Created:** [March 21, 2002, 10:31pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428 "2002-03-21T22:31:51Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![Fenris](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/fenris/32/498_2.png) [@Fenris](https://boards.straightdope.com/u/Fenris)
#### Post date: [March 21, 2002, 10:31pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/1 "2002-03-21T22:31:51Z")

</div>

I’m missing something very obvious. Can someone clue me in on what I’m missing?

I’m trying to do a link button in HTML and it’s not linking.

Here’s the directory structure I’m dealing with:

c:\foo\bar\

In c:\foo is a file called spa.html (ie, it’s path is c:\foo\spa.html )

In c:\foo\bar\ is a file called fon.html (c:\foo\bar\fon.html)

In the fon.html doc, I’ve got the following code:

\<FORM METHOD=“LINK” ACTION=“c:\foo\spa.html”\>  
\<INPUT TYPE=“submit” VALUE=“Home”\>  
\</FORM\>

But it doesn’t work at all.

Strangely, if I do \<a href=“c:\foo\spa.html”\>Home\</a\> I get a link that works just fine. It’s a workaround, but I’m irritated by the fact that I can’t get the button to work.

Help!?

Thanks!

Fenris

---

<div class="post-metadata">

### Author: ![Duckster](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/duckster/32/1244_2.png) [@Duckster](https://boards.straightdope.com/u/Duckster)
#### Post date: [March 21, 2002, 10:56pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/2 "2002-03-21T22:56:57Z")

</div>

For a FORM to work correctly the Action attribute must refer to a CGI action. What you are attempting to do is use a FORM as an ordinary link. Of course it won’t work because it is not a CGI action.

According to W3C standards, “action - This attribute specifies a form processing agent. User agent behavior for a value other than an HTTP URI is undefined.”

Source: [http://www.w3.org/TR/html401/interact/forms.html#h-17.3](http://www.w3.org/TR/html401/interact/forms.html#h-17.3)  
BTW, you are using an absolute path in your example. Better to use a relative path. Ideally, web pages, or even a complete web site, should be portable enough that you could move it lock, stock and barrel from one server to another with mininal to no tweaking.

---

<div class="post-metadata">

### Author: ![TheLoadedDog](https://avatars.discourse-cdn.com/v4/letter/t/35a633/32.png) [@TheLoadedDog](https://boards.straightdope.com/u/TheLoadedDog)
#### Post date: [March 21, 2002, 11:17pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/3 "2002-03-21T23:17:55Z")

</div>

> [@](#):
>
> \*Originally posted by Fenris \*  
> **Strangely, if I do \<a href=“c:\foo\spa.html”\>Home\</a\> I get a link that works just fine. It’s a workaround, but I’m irritated by the fact that I can’t get the button to work.**

You could always just download a button (or make one yourself) from one of those free web gear sites. I’m sure they have buttons which look like the square, grey Windows ones, if that’s what you’re after (hell, you can have a Hello Kitty one if you like).

So if we call it “button.gif”, then you can have:  
\<a href=“c:\foo\spa.html”\>\<img=“button.gif” BORDER=0\>\</a\>

---

<div class="post-metadata">

### Author: ![Snetho](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@Snetho](https://boards.straightdope.com/u/Snetho)
#### Post date: [March 21, 2002, 11:20pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/4 "2002-03-21T23:20:17Z")

</div>

Actaually you can just do:

\<form action=“c:\foo\spa.html”\>  
\<input type=“submit” value=“home”\>

I _think_ Fenris was mostly correct (it need not be exclusively CGI), but this sort of tricks the browser into doing what you want it to do…You could also take a snapshot of a button and make it an image and use that as a link.

---

<div class="post-metadata">

### Author: ![Snetho](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@Snetho](https://boards.straightdope.com/u/Snetho)
#### Post date: [March 21, 2002, 11:28pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/5 "2002-03-21T23:28:49Z")

</div>

> [@](#):
>
> I _think_ Fenris was mostly correct…

Ooops, I meant “Duckster”.

Also, I tried your way and it worked fine. Are you receiving any error messages? If so, it may just be the URL that is wrong.

---

<div class="post-metadata">

### Author: ![galt](https://avatars.discourse-cdn.com/v4/letter/g/35a633/32.png) [@galt](https://boards.straightdope.com/u/galt)
#### Post date: [March 21, 2002, 11:33pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/6 "2002-03-21T23:33:02Z")

</div>

> [@](#):
>
> \*Originally posted by Duckster \*  
> For a FORM to work correctly the Action attribute must refer to a CGI action. What you are attempting to do is use a FORM as an ordinary link. Of course it won’t work because it is not a CGI action.

Wrong. CGI has nothing to do with it. Here’s an example of a form which gets submitted to a non-CGI url: [http://www.codsquad.com/~galt/buttonlink.html](http://www.codsquad.com/~galt/buttonlink.html)  
The problem is that “LINK” is not a valid form method. Your choices are GET and POST. “GET” is a link. When you submit a GET form, the form contents are appended as arguments to the action URL specified in the form, and the browser is sent to that URL. So really, all you have to do is change your form’s method to GET.

---

<div class="post-metadata">

### Author: ![TheLoadedDog](https://avatars.discourse-cdn.com/v4/letter/t/35a633/32.png) [@TheLoadedDog](https://boards.straightdope.com/u/TheLoadedDog)
#### Post date: [March 21, 2002, 11:34pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/7 "2002-03-21T23:34:03Z")

</div>

**Snetho** , I think you’re right. I have used forms in the past, and they weren’t anything to do with CGI (they are better with CGI though). I’m just wondering if a form will work for a simple link button. Might be overkill. It would remove the problem of having to provide a graphic though, as it is automatically rendered by the browser. I’m still inclined to go with the simple \<a\> tags.

Also, **Duckster** is right about the relative addressing. Just call it “spa.html” and it’ll be easier to work with.

---

<div class="post-metadata">

### Author: ![galt](https://avatars.discourse-cdn.com/v4/letter/g/35a633/32.png) [@galt](https://boards.straightdope.com/u/galt)
#### Post date: [March 22, 2002, 9:28pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/8 "2002-03-22T21:28:02Z")

</div>

> [@](#):
>
> \*Originally posted by TheLoadedDog \*  
> I’m just wondering if a form will work for a simple link button. Might be overkill.

What’s to wonder about? It works. Overkill, schmoverkill. It’s not like using a form takes up a significant amount of resources or extra work. If you want the thing to look like a button, it’s a whole lot more sensible to use a real button than it is to fake it with pictures of buttons (because if you fake it, it’s much more work to get the correct button behavior (i.e. pushing in when you click, etc), and it’s more work to get it to look right on varying platforms).

---

<div class="post-metadata">

### Author: ![erislover](https://avatars.discourse-cdn.com/v4/letter/e/71e660/32.png) [@erislover](https://boards.straightdope.com/u/erislover)
#### Post date: [March 22, 2002, 9:34pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/9 "2002-03-22T21:34:39Z")

</div>

I would override the OnSubmit() action of a form with javascript. Forget the CGI.

---

<div class="post-metadata">

### Author: ![erislover](https://avatars.discourse-cdn.com/v4/letter/e/71e660/32.png) [@erislover](https://boards.straightdope.com/u/erislover)
#### Post date: [March 22, 2002, 9:38pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/10 "2002-03-22T21:38:25Z")

</div>

Actually, are you getting information from the form, **Fenris**? You should be able to just put the button in as such:

\<input type=“button” OnClick=“_javascript function call_” /\>  
and forget about the form.

---

<div class="post-metadata">

### Author: ![Lance\_Turbo](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lance_turbo/32/6156_2.png) [@Lance\_Turbo](https://boards.straightdope.com/u/Lance_Turbo)
#### Post date: [March 22, 2002, 11:28pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/11 "2002-03-22T23:28:27Z")

</div>

I have also gone the route that **erislover** suggests. Here’s a scrap of code from a web site I did some work on.

\<INPUT TYPE=“button” VALUE=“Song List” ONCLICK=“top.main.location.href=‘songs.htm’”\>

That button actually changes the content of another frame, but is easily modified for whatever purpose. This is slightly less code than using form tags, especially if you want multiple buttons on a page linking to multiple pages. The drawback of this is that it may not work on browser’s with javascript diabled.

---

<div class="post-metadata">

### Author: ![GuanoLad](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/guanolad/32/42_2.png) [@GuanoLad](https://boards.straightdope.com/u/GuanoLad)
#### Post date: [March 23, 2002, 4:58am UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/12 "2002-03-23T04:58:32Z")

</div>

I think saying “Hey, just use javascript and your problem is solved” overlooks the fact that not a lot of beginners know a darn thing about javascript.

Suggesting javascript: reasonable idea  
Assuming javascript is easier than HTML: wrong idea

---

<div class="post-metadata">

### Author: ![erislover](https://avatars.discourse-cdn.com/v4/letter/e/71e660/32.png) [@erislover](https://boards.straightdope.com/u/erislover)
#### Post date: [March 23, 2002, 5:36am UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/13 "2002-03-23T05:36:41Z")

</div>

assuming javascript is easier than CGI? Priceless. 😃

Ok, I could have been more detailed.

```auto

<input type="button" value="click me" OnClick="top.location.href='http://boards.straightdope.com.sdmb/'" />

```

Works for me. 🙂

---

<div class="post-metadata">

### Author: ![Snetho](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@Snetho](https://boards.straightdope.com/u/Snetho)
#### Post date: [March 23, 2002, 12:48pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/14 "2002-03-23T12:48:28Z")

</div>

I think the top.xxx refers to a frame. I think location.href will work just fine.  
\<input type=“button” value=“Home” OnClick=“location.href=‘c:\foo\spa.html’”\>

---

<div class="post-metadata">

### Author: ![Fenris](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/fenris/32/498_2.png) [@Fenris](https://boards.straightdope.com/u/Fenris)
#### Post date: [March 23, 2002, 1:22pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/15 "2002-03-23T13:22:06Z")

</div>

> [@](#):
>
> \*Originally posted by Snetho \*  
> \*\*I think the top.xxx refers to a frame. I think location.href will work just fine.  
> \<input type=“button” value=“Home” OnClick=“location.href=‘c:\foo\spa.html’”\> \*\*

This is actually what I’m using now! Thanks to everyone for all their help.

BTW: I know about relative paths, but I thought it’d make more sense to use absolute paths in the example. In retrospect I don’t know why.

PS: Erislover-Javascript!? :eek: I’m just _barely_ figuring out what’s going on with HTML 😉

Fenris

---

<div class="post-metadata">

### Author: ![erislover](https://avatars.discourse-cdn.com/v4/letter/e/71e660/32.png) [@erislover](https://boards.straightdope.com/u/erislover)
#### Post date: [March 23, 2002, 4:56pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/16 "2002-03-23T16:56:56Z")

</div>

Sorry, I guess it is just a matter of how you go about learning something. I copy and pasted javascript from websites long before I knew how to do anything with it.

The absolute best way to learn HTML, if you are teaching yourself, is to view the source of other people’s webpages (though I must say this sort of a button is pretty rare) with a combo of a reference book to look at when you are stumped. I thought [this](http://www.cookwood.com/html4_4e/) was a good book, though I moved on to something else now.

When you hand-code [this](http://www.geocities.com/erislover/principia/principia.html) there’s some things you never forget! (well, ok, I just hand-formatted it and drew some pics, someone else had done the transcription, and yeah, I’m still not done with the damn thing).

But still, setting up a forwarding/redirect form with CGI is pretty difficult in its own right, especially if you are trying to test it out on your own machine. It is actually kind of surprising that what you suggest isn’t easier to code.

---

<div class="post-metadata">

### Author: ![galt](https://avatars.discourse-cdn.com/v4/letter/g/35a633/32.png) [@galt](https://boards.straightdope.com/u/galt)
#### Post date: [March 25, 2002, 6:43am UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/17 "2002-03-25T06:43:56Z")

</div>

Aaaarrgh! You don’t need JavaScript **or** CGI! Listen!

---

<div class="post-metadata">

### Author: ![OneChance](https://avatars.discourse-cdn.com/v4/letter/o/74df32/32.png) [@OneChance](https://boards.straightdope.com/u/OneChance)
#### Post date: [March 25, 2002, 1:05pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/18 "2002-03-25T13:05:30Z")

</div>

**galt** , what’re you trying to say?

---

<div class="post-metadata">

### Author: ![galt](https://avatars.discourse-cdn.com/v4/letter/g/35a633/32.png) [@galt](https://boards.straightdope.com/u/galt)
#### Post date: [March 25, 2002, 7:12pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/19 "2002-03-25T19:12:05Z")

</div>

> [@](#):
>
> \*Originally posted by OneChance \*  
> \*\ ***galt** , what’re you trying to say? \*\*

that the only thing wrong with the HTML in the OP is that it says “LINK” instead of “GET”.

---

<div class="post-metadata">

### Author: ![OneChance](https://avatars.discourse-cdn.com/v4/letter/o/74df32/32.png) [@OneChance](https://boards.straightdope.com/u/OneChance)
#### Post date: [March 25, 2002, 9:45pm UTC](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428/20 "2002-03-25T21:45:59Z")

</div>

METHOD=LINK isn’t valid as far as I know, but it’s funny that the HTML Goodies site [uses it](http://www.htmlgoodies.com/tutors/formbutt.html), as well as several other sites. Actually, you don’t need a METHOD at all, so putting in a METHOD of LINK or GET or MYMOTHERWEARSCOMBATBOOTS won’t make any difference, the button will still work.

Also, you do need JavaScript. OnClick is a JavaScript event handler.

[Next page](https://boards.straightdope.com/t/html-help-buttons-that-link-and-the-people-who-want-them/99428.md?page=2)