Adding form values using javascript or PHP?
I am trying to create a form that will automatically calculate points based on the options chosen this is what i came up with but so far it doesn't seem to work
<html>
<head>
<link rel="stylesheet" href="style000.css" type="text/css" media="screen" />
</head>
<body>
<form name="form">
<label>Age</label>
<select name='g'>
<option value='' >Select One</option>
<option value='0' >Less than 17</option>
<option value='2' >17</option>
<option value='4' >18</option>
<option value='6' >19</option>
<option value='8' >20</option>
<option value='10' >21-49</option>
<option value='8' >50</option>
<option value='6' >51</option>
<option value='4' >52</option>
<option value='2' >53</option>
<option value='0' >54+</option>
</select>
<label>Education</label><select name='a'>
<option value='' selected='selected'>Select one</option>
<option value='0' >No High School</option>
<option value='5' >Secondary School</option>
<option value='12' >One Year Diploma, apprenticeship AND 12 years full time study</option>
<option value='15' >One Year Diploma, apprenticeship AND 13 years full time study</option>
<option value='15' >Bachelors Degree from University AND 13 years full time study</option>
<option value='20' >2 year diploma AND 14 years full time study</option>
<option value='20' >2 year bachelor's degree from university AND 14 years full time study</option>
<option value='22' >3 year diploma AND 15 years full time study</option>
<option value='22' >2 bachelor degrees from university and 15 years full time study</option>
<option value='25' >PhD or Masters & 17 years full time study</option>
</select>
<h3><strong>Primary Language</strong></h3>
<label>Speaking</label>
<select name="c">
<option value='' >Select One</option>
<option value='4' >6.5+</option>
<option value='2' >5.5 – 6.0</option>
<option value='1' >4.0 – 5.0</option>
<option value='0' >Less than 4.0</option>
</select>
<label>Listening</label>
<select name="d">
<option value='' selected='selected'>Select One</option>
<option value='4' >7.5+</option>
<option value='2' >5.5 – 7.0</option>
<option value='1' >4.5 – 5.0</option>
<option value='0' >Less than 4.5</option>
</select>
<label>Reading</label>
<select name="e">
<option value='' >Select One</option>
<option value='4' >6.5+</option>
<option value='2' >5.0 – 6.0</option>
<option value='1' >3.5 – 4.5</option>
<option value='0' >Less than 3.5</option>
</select>
<label>Writing</label>
<select name='f'>
<option value='' >Select One</option>
<option value='4' >6.5+</option>
<option value='2' >5.5 – 6.0</option>
<option value='1' >4.0 – 5.0</option>
<option value='0' >Less than 4.0</option>
</select>
<h3><strong>Work</strong></h3>
<label>Work Experience</label>
<select name="b">
<option value=''>Select One</option>
<option value='0' >Less than 1 year</option>
<option value='15' >1 Year</option>
<option value='17' >2 Years</option>
<option value='19' >3 Years</option>
<option value='21' >4 Years or more</option>
<label>Arranged Employment</label>
<select name="l">
<option value=''>Select One</option>
<option value='10'>Yes</option>
<option value='0'>No</option>
</s开发者_如何学运维elect>
<h3><strong>Adaptability</strong></h3>
<label>Spouse's Education</label>
<select name="h">
<option value='' >Select One</option>
<option value='0' >Secondary School</option>
<option value='3' >One Year Diploma, apprenticeship AND 12 years full time study</option>
<option value='3' >Bachelors Degree from University AND 13 years full time study</option>
<option value='4' >A two-year diploma, trade certificate or apprenticeship or university degree at the bachelor's level and completed at least 14 years of full-time or full-time equivalent studies</option>
<option value='4' >A three-year diploma, trade certificate or apprenticeship (not university) and completed at least 15 years of full-time or full-time equivalent studies</option>
<option value='4' >Two or more university degrees at the bachelor's level and completed at least 15 years of full-time or full-time equivalent studies</option>
<option value='5' >A master's or Ph.D. and completed at least 17 years of full-time or full-time equivalent studies</option>
<option value='0' >No Education</option>
</select>
<label>Applicant OR Spouse has studied in Canada</label>
<select name='i'>
<option value='5'>Yes, more than two years post secondary after the age of 17.</option>
<option value='0'>Yes, but for less than two years</option>
<option value='0'>No</option>
</select>
<label>Applicant OR Spouse has worked in Canada</label>
<select name="j">
<option value='' selected='selected'>Select One </option>
<option value='5'>Worked full-time in Canada for at least one year</option>
<option value='0'>Yes, but for less than 1 year</option>
<option value='0'>No</option>
</select>
<label>Applicant or Spouse has Family in Canada</label>
<select name="k">
<option value='' selected='selected'>Select One</option>
<option value='5'>Yes</option>
<option value='0'>No</option>
</select>
<INPUT NAME="calc" VALUE="Calculate" TYPE="button" onClick="compute(this.form)">
<input name="rslt" type="text" style="font-size: 50px" value="" size="5" readonly="readonly">
<h3 style="font-size: 50px">points</h3>
</form>
<script language="JavaScript">
<!-- hide this script from old browsers
function compute(form)
{
var a = parseInt(form.a.value);
var b = parseInt(form.b.value);
var c = parseInt(form.c.value);
var d = parseInt(form.d.value);
var e = parseInt(form.e.value);
var f = parseInt(form.f.value);
var g = parseInt(form.g.value);
var h = parseInt(form.h.value);
var i = parseInt(form.i.value);
var j = parseInt(form.j.value);
var k = parseInt(form.k.value);
var l = parseInt(form.l.value);
f = (a + b + c + d + e + f + g +h + j + k + l);
form.rslt.value = f;
}
// done hiding from old browsers -->
</script>
</body>
</html>
what am i doing wrong is there an other way of doing it with javascript or PHP, preferably javascript thanks
Your <select name="b"> element is missing its closing </select> tag, so the following <select name="l"> element is lost, and you're getting an Error when you try to do form.l.value.
Proper indentation helps avoid such issues.
Note that you may want to do this:
var a = parseInt(form.a.value, 10) || 0;
var b = parseInt(form.b.value, 10) || 0;
var c = parseInt(form.c.value, 10) || 0;
var d = parseInt(form.d.value, 10) || 0;
// and so on
...so you don't get NaN if some value is "" and to ensure base 10.
加载中,请稍侯......
精彩评论