HTML - Form Submission Options?

I want a form so a person can type in a story and it can be sent to the database, where users can browse it in the stories section of my site.

I have no idea where to start!

Hello,

I'm trying to put together an online signup form for a children's summer program. I'd like to have a calculator for the total price of classes at the bottom as well as a "submit" button that will email me all entered information.

I had tried using cgiemail (http://web.mit.edu/wwwdev/cgiemail/), which was already installed on my server, but my problem was that it sends me information from the "value" fields, which are already used for the price calculator.

For instance, the price of each class in my sample is $55, so I have the value field for each choice set to 55. Unfortunately, cgiemail also wants to use the value field, so I would receive a list of "55"s rather than class names.

Does anyone have a suggestion for how to fix this? I am very much an amateur at all of this, so if you think there's a better way to set up, I am open to suggestions. Thank you for the help!

Matt

Code:

<form name="classes" onclick="calculate()">
<b>Class Signup Form</b><br><br>

<P>
<b>Child Info:</b>
<TABLE CELLPADDING="1" CELLSPACING="1" WIDTH="550">
<tr><td width="200">Name:</td><td width="350"><INPUT name="childname"></td></tr>
<tr><td width="200">Date of Birth:</td><td width="350"><INPUT name="childage" value="mm/dd/yyyy" maxlength="10"></td></tr>
<tr><td width="200">Age:</td><td width="350"><select name="childage" STYLE="width: 50px;">
<option value="age5" selected="selected">5</option>
<option value="age6">6</option>
<option value="age7">7</option>
<option value="age8">8</option>
<option value="age9">9</option>
<option value="age10">10</option>
<option value="age11">11</option>
<option value="age12">12</option>
<option value="age13">13</option>
<option value="age14">14</option>
</select></td></tr>
<tr><td width="200">T-Shirt Size:</td><td width="350"><select name="childshirt" STYLE="width: 50px;">
<option value="shirtxs" selected="selected">XS</option>
<option value="shirts">S</option>
<option value="shirtm">M</option>
<option value="shirtl">L</option>
<option value="shirtxl">XL</option></td></tr>
<tr><td width="200">Address:</td><td width="350"><INPUT name="childaddress1"></td></tr>
<tr><td width="200"></td><td width="350"><INPUT name="childaddress2"></td></tr>
<tr><td width="200">City:</td><td width="350"><INPUT name="childcity"></td></tr>
<tr><td width="200">State:</td><td width="350"><INPUT name="childstate"></td></tr>
<tr><td width="200">Zip:</td><td width="350"><INPUT name="childzip"></td></tr>
</TABLE>
</p>
<p>Allergy/Medication Information:<br><textarea rows="5" cols="50"></textarea></p>

<P>
<b>Parent/Guardian Info:</b>
<TABLE CELLPADDING="1" CELLSPACING="1" WIDTH="550">
<tr><td width="200">Parent 1 Name:</td><td width="350"><INPUT name="parent1name"></td></tr>
<tr><td width="200">Daytime Phone:</td><td width="350"><INPUT name="parent1phone"></td></tr>
<tr><td width="200">Cell Phone:</td><td width="350"><INPUT name="parent1cell"></td></tr>
</TABLE><br>
<TABLE CELLPADDING="1" CELLSPACING="1" WIDTH="550">
<tr><td width="200">Parent 2 Name:</td><td width="350"><INPUT name="parent2name"></td></tr>
<tr><td width="200">Daytime Phone:</td><td width="350"><INPUT name="parent2phone"></td></tr>
<tr><td width="200">Cell Phone:</td><td width="350"><INPUT name="parent2cell"></td></tr>
</TABLE><br>
<TABLE CELLPADDING="1" CELLSPACING="1" WIDTH="550">
<tr><td width="200">Billing Email:</td><td width="350"><INPUT name="billingemail"></td></tr>
<tr><td width="200">Alternate Email:</td><td width="350"><INPUT name="alternateemail"></td></tr>
</TABLE>
</p>

<P>
<b>Week 1 Classes</b><br>
<TABLE CELLPADDING="1" CELLSPACING="1" WIDTH="550">
<tr><td width="200">9:30 - 10:45</td><td width="350">
<select name="w1c1" STYLE="width: 200px;">
<option value="0" selected="selected">- No Class -</option>
<option value="55" name="DoppClass">Mountain Biking</option>
<option value="55" name="Class 3">Witchcraft</option>
<option value="55" name="DoppClass">Nintendo</option>
</select></td></tr>
<tr><td width="200">10:45 - Noon</td><td width="350">
<select name="w1c2" STYLE="width: 200px;">
<option value="0" selected="selected">- No Class -</option>
<option value="55">Running with Scissors</option>
<option value="55">Trapeze</option>
<option value="55">Dance</option>
</select></td></tr>
<tr><td width="200">1:00 - 2:15</td><td width="350">
<select name="w1c3" STYLE="width: 200px;">
<option value="0" selected="selected">- No Class -</option>
<option value="55">Clock-Building</option>
<option value="55">Monkeys with Hats</option>
<option value="55">Trains</option>
</select></td></tr>
<tr><td width="200">2:15 - 3:30</td><td width="350">
<select name="w1c4" STYLE="width: 200px;">
<option value="0" selected="selected">- No Class -</option>
<option value="55">Cricket</option>
<option value="55">Crochet</option>
<option value="55">Crocodiles</option>
</select></td></tr>
</TABLE>
</p>

<p><input type=button name=calculate value="Calculate Total Price" onClick="pricecalculate();"></P>

<p>$<input type=text name=txtAnswer> </p>

</form>

<script language = "javascript">

function pricecalculate(){
var w1c1=eval(document.classes.w1c1.value);
var w1c2=eval(document.classes.w1c2.value);
var w1c3=eval(document.classes.w1c3.value);
var w1c4=eval(document.classes.w1c4.value);



document.classes.txtAnswer.value=w1c1 + w1c2 + w1c3 + w1c4;
}
</script>

Hey, just a quick question...

How would i go about using an image as a select option in a form? i know its possible as ive seen it around on a few sites before, but im not sure how to do it myself. tried the obvious:

<select name="stars">
<option value="1"><img src="MYIMAGE"></option>
</select>

but oviously that doesnt work.

any help would be greatly appreciated.

hi everyone,

ok heres my problem that is bugging me. I have a ecommerce website that im setting up and it comes with a default search feature.
Code:

<form name="quick_find" action="MYDOMAIN/index.php?main_page=advanced_search_result" method="get">
<input type="hidden" name="main_page" value="advanced_search_result" />
<input type="hidden" name="search_in_description" value="1" />
<input type="text" name="keyword" size="18" maxlength="100" style="width: 103px; margin-right:5px; vertical-align:middle;" value="" onfocus="if (this.value == 'Enter search keywords here') this.value = '';" />
<input type="submit" value="Search" style="width: 50px; vertical-align:middle;" />
</form>

on my site i sell music LP's and each lp has in its description the year it was released.

If i was to put in the above form "1996" it would search all my products and return any that have "1996" in their desctiption.

With this in mind i would like to create a form that had 4 drop down boxes. day,month,year,country

I have created the following code below;

Code:

<form name="quick_find_header" action="MYDOMAIN/index.php?main_page=advanced_search_result" method="get">
<input type="hidden" name="main_page" value="advanced_search_result" />
<input type="hidden" name="search_in_description" value="1" /> 
<select name="keyword">
<option value="1952">1952</option>
<option value="1953">1953</option>
<option value="1954">1954</option>
<option value="1955">1955</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option selected value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>

</select>
<select name="keyword">

<option value="01">Jan</option>
<option value="02">Feb</option>
<option value="03">Mar</option>
<option value="04">Apr</option>
<option value="05">May</option>
<option value="06">Jun</option>
<option selected value="07">Jul</option>
<option value="08">Aug</option>
<option value="09">Sep</option>
<option value="10">Oct</option>
<option value="11">Nov</option>
<option value="12">Dec</option>

</select>
<select name="keyword">

<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option selected value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>

<input type="image" src="includes/templates/theme013/buttons/english/button_search.gif" alt="Search" title=" Search " style="margin-left:1px;" /> </form>

this gives me 3 drop down box's (YEAR,MONTH,DAY)

The problem is when i click search it only searches for the year. instead of combining all the selected data (e.g. 1996+JUN+23) it just searched for 1996.

The second problem is if someone managed to get this form to work, would it search for "1996JUN23" or "1996 JUN 23". The reason i ask this is my products descriptions say "this single was released on 23 June 1996"

I hope ive made all the above clear!!

Any help would be greatly appreciated.

thanks in advance

I would like to know how to create a mini form of two pull down boxes so that when the two selections have been made and submitted it returns back a designated page or picture.

For example I want to build a simple method to show routes of an office building. Pulldown box 1 would be the office number you want to start from, and pulldown box two would be the office you want to get to. when you click submit it would pull up either a page or picture which contains the corrrect floor plan and route. I feel like this should not be too hard as I don't need anything very flashy. I just don't know how to start it.

If anyone knows of something open source already created to do this I would be open to that too.

Thanks in advance for any assistence you can give.

How can I restrict form submission to only the Submit button? I find the forms can be submitted also by the user pressing the "enter" or the "return" key (Users typically use IE or Firefox) By a mouseover the "Submit" button, a final check of data integrity is done as follows....

<INPUT type="submit" value="Submit Form" onmouseover="validate(personal_SS.value,personal_SS.id,personal_lastname.value,personal_lastname.id, personal_firstname.value,personal_firstname.id,personal_Birthdate.value,personal_Birthdate.id)"> <INPUT type="reset" value="Clear form"> Data is 128 bit SSL encrypted

function validate(strngSS,x,strngLN,y,strngFN,z,strngBD,w)
{

if (strngSS== "") {alert("You didn't enter a Social Security Number.");
document.ReturnPatientEntry.x.focus();
return;

}
else
{
if ((strngSS.length < 9) || (strngSS.length > 9)) {alert("The Social Security Number is the wrong length. Just use numbers, no dashes... like 123456789 not " + strngSS);
document.ReturnPatientEntry.x.focus();
return;

}
else
{
var illegalChars = /\W\#/;
if (illegalChars.test(strngSS)) {alert( "The Social Security Number contains illegal characters. Just use numbers, no dashes or # signs.");
document.ReturnPatientEntry.x.focus();
return;

}
}
}
validateLN(strngLN,y)
validateFN(strngFN,z)
validateBD(strngBD,w)
}

function validateLN(strng,x)
{

if (strng== "") {alert("You didn't enter a Last Name.");
document.ReturnPatientEntry.x.focus();
return;

}
else
{
if ((strng.length < 3) || (strng.length > 15)) {alert("The Last Name is the wrong length. Just use letters, no dashes... " + strng);
document.ReturnPatientEntry.x.focus();
return;

}
else
{
var illegalChars = /\W\#/;
if (illegalChars.test(strng)) {alert( "The Last Name contains illegal characters. Just use letters, no dashes or spaces.");
document.ReturnPatientEntry.x.focus();
return;

}
}
}
}


function validateFN(strng,x)
{

if (strng== "") {alert("You didn't enter a First Name.");
document.ReturnPatientEntry.x.focus();
return;

}
else
{
if ((strng.length < 2) || (strng.length > 12)) {alert("The First Name is the wrong length. Just use letters, no dashes... " + strng);
document.ReturnPatientEntry.x.focus();
return;

}
else
{
var illegalChars = /\W\#/;
if (illegalChars.test(strng)) {alert( "The First Name contains illegal characters. Just use letters, no dashes or spaces.");
document.ReturnPatientEntry.x.focus();
return;

}
}
}
}

function validateBD(strng,x)
{

if (strng=="") {alert("Please enter a valid Birthdate");
document.ReturnPatientEntry.x.focus();
return;
}
else
{
if ((strng.length<8) || (strng.length>8)) {alert("Please enter your Birthdate in the form mm/dd/yy, not " + strng);
document.ReturnPatientEntry.x.focus();
return;
}
else
{
var illegalChars=/[\-\.\m\,\ ]/;
if (illegalChars.test(strng)) {alert("The Birtdate contains illegal characters, use the format mm/dd/yy, not " + strng);
document.ReturnPatientEntry.x.focus();
return;
}
}
}
}


I know the coding is primitive, but it works. If the "Clear form" button is pressed, multiple consecutive error messages are tripped as the form is cleared. Can I suppress this as well?

Thanks,
Douglas McKibbin
augustasurgery.org

I recently just created a site: http://celticsinsider.webs.com, and I was wondering how I could put an article submission button on one of my pages? I only know html, by the way.

I am building a site with two simple forms in it - they are purely for sending through some info, name address etc to an email address.

When I put a form in and test it, I click the submit button and it opens outlook and proceeds to send the data in a long line. Is this all possible in html? I want to do it in the simplest way possible.

Many thanks for your help.

......................

I was wondering if someone could help me out.

If you go to the page i am currently working on at http://www.tablerunnersent.com/index2.html

If you look mid page you will see an email form.

I was wondering how i would set that form up so if a visitor clicks on submit it would email me at newsletter@tablerunnersent.com the information that they submitted.

This is what i have so far in the HTML Coding:
Code:

< form action="">
				<div>

					<div class="formfield">
					<strong>Name :</strong>
					<input type="text" />

					<br />

					<strong>E-mail :</strong>
					<input type="text" />
					</div>

					<input type="image" src="images/submit_button.gif" class="button_submit" />
					<div class="clearthis">&nbsp;</div>

				</div>
				</form>

http://www.archive.org/download/kris...nityananda.rar
(right-click save-as)

Made it myself. Uploaded to download.com They haven't accepted as yet.

Waddya u think? It's simple html. You can modify if you like.

Im wondering if anybody knows how to insert your web site into all the popular search engines? Is their a program?? Or do you hjave to go to each search engine manually? Any help would be greatly appreciated! Thanks

Hi guys, first thing first, nice to be part of this forum.

My first post and question. Suppose i have 5 identical forms with name, address, city, post code, is it possible to do one submission for all rather than doing it one by one...

Thanks

I have a page which allows users to perform searches (Player News Search). For whatever reason, in IE, if you enter something in the search box then press the ENTER key on the keyboard, it breaks the layout on my page. However, if the user clicks the ENTER button with their mouse, everything works as expected.

Is there any way to disable the ENTER key for a particular button so that the user must click with their mouse?