I’m trying to derive the users age from DOB using a script, then depending on this age award them points for two areas Federal(f) and Quebec(q) Immigration, as they both calculate age points i have a set of if…else commands to award points and display them in two textboxes.
currently the script for calcualting the points parseInt’s the text field that displays the age(this field is populated by the dobtoage script)
heres my code and a live preview.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Quebec and Federal Immigration Points Calculator</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
</head>
<body>
<form name="form">
<p>Your Date of Birth (format:<strong>dd/mm/yyyy</strong>)</p><br />
<input onmouseout="showAge()" name="dob" id="dob" />
<p>Your Age</p><input name="age" type="text" style="font-size: 15px" value="" size="7" readonly>
<INPUT NAME="calc" VALUE="Calculate" TYPE="button" onClick="compute(this.form)"><br />
<input name="rsltf" type="text" style="font-size: 50px" value="" size="20" readonly /><br />
<input name="rsltq" type="text" style="font-size: 50px" value="" size="20" readonly />
</form>
<script type="text/javascript">
function showAge(){
var d =document.getElementById('dob').value.split('/');
var today=new Date();
var bday=new Date(d[2],d[1],d[0]);
var by=bday.getFullYear();
var bm=bday.getMonth()-1;
var bd=bday.getDate();
var age=0; var dif=bday;
while(dif<=today){
var dif = new Date(by+age,bm,bd);
age++;
}
age +=-2 ;
form.age.value = age;
}
</script>
<script type="text/javascript">
function compute(form)
{
var a = parseInt(form.age.value, 10) || 0;
if (a == 17)
{
f = 2; q = 0;
}
else if (a == 53)
{
f = 2; q = 0;
}
else if (17 > a > 53)
{
f = 0; q = 0;
}
else if (a == 19)
{
f = 6; q = 16;
}
else if (a == 51)
{
f = 6; q = 0;
}
else if (a == 18)
{
f = 4; q = 16;
}
else if (a == 20)
{
f = 8; q = 16;
}
else if (a == 50)
{
f = 8; q = 0;
}
else if (a == 52)
{
f = 4; q = 0;
}
else if (35 >= a >= 21)
{
f = 10; q = 16;
}
else if (a == 36)
{
f = 10; q = 14;
}
else if (a == 37)
{
f = 10; q = 12;
}
else if (a == 38)
{
f = 10; q = 10;
}
else if (a == 39)
{
f = 10; q = 8;
}
else if (a == 40)
{
f = 10; q = 6;
}
else if (a == 41)
{
f = 10; q = 4;
}
else if (a == 42)
{
f = 10; q = 2;
}
else if (a == 43)
{
f = 10; q = 0;
}
else if (50 >= a >= 44)
{
f = 10; q = 0;
}
form.rsltf.value = f;
form.rsltq.value = q;
}
</script>
</body>
</html>
First, you’re calculating age weirdly.
Do this:
As to the giant if elseif structure, first I’d break it up into two separate structures. This allows you to take advantage of ranges in one that aren’t available in the other to shorten your overall structure. The age ranges are so jumbled up in it that I don’t really feel like picking through it to construct the appropriate structures. Might want to take advantage of switch case statements instead of if/elseif/else.
Also, put your functions up in the head where they belong. Also, you need some error checking on the ShowAge() function in case it’s not a valid date. Also, you need use
getElementByIdon the form’s id to change it’s value inShowAge()at the end, otherwise it has no idea whatformis. So, give your form an id and change the end ofShowAge()to: