Form question [Archive] - CodingForums.com

View Full Version : Form question

alrukus

10-29-2003, 06:52 PM

Hey. I am a newbie to html. Could someone tell me how I could turn the following html code into like a working form? I have all the buttons and boxes I need and the cgi script to handle it i just don't know hwo to like make it work. The code is below. Thanks so much...

<html>

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

<body bgcolor="#FFFFFF">
<div align="center"><center>

<table border="0" cellpadding="4" width="500" cellspacing="0">
<tr>
<td width="100%" bgcolor="#000000" height="21" colspan="4"><font color="#FFFFFF"
face="Tahoma">Your Email: </font><input type="text" name="email" size="20"
style="background-color: rgb(255,255,255); color: rgb(0,0,0)"></td>
</tr>
<tr>
<td width="100%" bgcolor="#CCCCCC" height="21" colspan="4"><font face="Tahoma"
color="#000000">Select the car(s) you are intrested in</font></td>
</tr>
<tr>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Audi</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Bmw</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Cadaliac</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Chevy</small></font></td>
</tr>
<tr>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Dodge</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Datsun</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Ford</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> GMC</small></font></td>
</tr>
<tr>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Honda</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Infiniti</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Mitsubishi</small></font></td>
<td width="25%" bgcolor="#000000" height="21"><font color="#FFFFFF" face="Tahoma"><small><input
type="checkbox" name="C1" value="ON" style="background-color: rgb(0,0,0)"> Nissan</small></font></td>
</tr>
<tr>
<td width="100%" bgcolor="#CCCCCC" height="21" colspan="4"><font face="Tahoma"><p
align="center"></font><input type="submit" value="Submit" name="B1"></td>
</tr>
</table>
</center></div>
</body>
</html>

Kor

10-30-2003, 11:16 AM

just insert the forms elements between a <form> and a </form> tags. Specify the method for submit and the adress were you submit the form (the action). Optional, give a name to that form:

<form method="POST" action = "http://www.someurl.com/someCGIaplication">

elemets here
<input whatever>
<input whatever>
<input whatever>
.

<input type="submit" value="submit">
</form>

Methods are POST or GET... ask the webmaster the URL of the server-side application and what kind of method you need.

jeskel

10-30-2003, 11:29 AM

I'd just like to add to Kor's reply that it's better to insert the forms tags outisde of your table tags:

<form method="POST" action = "http://www.someurl.com/someCGIaplication">

<div align="center"><center>
<table border="0" cellpadding="4" width="500" cellspacing="0">
<tr>
<td width="100%" bgcolor="#000000" height="21" colspan="4"><font color="#FFFFFF"
face="Tahoma">Your Email: </font><input type="text" name="email" size="20"
style="background-color: rgb(255,255,255); color: rgb(0,0,0)"></td>

[...]

<td width="100%" bgcolor="#CCCCCC" height="21" colspan="4"><font face="Tahoma"><p
align="center"></font><input type="submit" value="Submit" name="B1"></td>
</tr>
</table>
</center></div>

</form>

all what you need is to know where your cgi scripts is and write the adress as the action of your form (like pointed out Kor).

<form method="POST" action="http://www.someurl.com/someCGIaplication">

if the METHOD is POST, the data won't appear in the url, if the METHOD is GET, the data will. "Post" is better (more infos can be posted and it is more secure) but in your situation I don't think it matters that much.
good luck
;)

Kor

10-30-2003, 12:03 PM

In fact i discovered that the best place is UNDER the TABLE tag. It works perfectly that way :)

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

Nightfire

10-30-2003, 12:05 PM

Just ain't valid coding though ;)

Kor

10-30-2003, 12:38 PM

Just ain't valid coding though

yes, of course... but it ain't an invalid one neither, as it works for all browsers, all platforms...

:D

I discovered that tip once when I needed to get rid of the inexpected space introduced by the form tag when inserted between two tables...

jeskel

10-30-2003, 01:41 PM

if it's not invalid and not valid....... then what is it?

I also have this space problem when inserting a form tag... but I wouldn't put it in the table. I've never tried to fix it since it's not a problem for me, but I would rather guess for a layering solution to get rid of that extra space if that's really an issue.

Nightfire

10-30-2003, 01:44 PM

jeskel

10-30-2003, 01:48 PM

hey! cool trick..... if one day that extra space bothers me, I'll use that.:thumbsup: thanx a lot.

Hey Kor, if that works, no more excuses for putting your form tags in a table ;) (just kiddin')

me'

10-30-2003, 05:11 PM

Originally posted by bouchel
hey! cool trick..... if one day that extra space bothers me, I'll use that.:thumbsup: thanx a lot. Same 'trick' works for ul, li, body, html.

jeskel

10-30-2003, 11:42 PM

Originally posted by me'
Same 'trick' works for ul, li, body, html.
ok cool advice... I never had to deal with those extraspaces in any ways (I mean it has never been a problem)... But now if I have to, I'll have the solution:thumbsup:

I definitly love when the solution comes before the problem ;)