check validate html elements

by slawe

HTML

<table> 
<tr> 
<td>First Name</td> 
<td><input type="text" id="t1" name="FirstName"></td> 
</tr> 
<tr> 
<tr>
<td>Gender</td>
<td><input type="radio" id="r1" name="gender" value=Male>Male 
<input type="radio" id="r2" name="gender" value=Female>Female</td> 
</tr> 
<tr> 
<td>Games Played</td> 
<td><select name="games" id="s1" >
<option value=''>Select One</option><option value=Football>FootBall</option>
<option value=Tenis>Tenis</option>
<option value=cricket>Cricket</option>
</select>
</td> 
</tr> 
<tr><td>Terms & Condition</td><td><input type=checkbox name=agree value=yes id=c1></td></tr> 
</table> 
<input type="submit" id="btnSignUp" value="Sign Up!!" />

JavaScript

function formValidation(oEvent) {
oEvent = oEvent || window.event;
var txtField = oEvent.target || oEvent.srcElement; 

var t1ck=true;
var msg=" ";
if(document.getElementById("t1").value.length < 1 )
{ t1ck=false; msg = msg + "Your name should be minimun 3 char length";}
if(!document.getElementById("r1").checked && !document.getElementById("r2").checked)
{ t1ck=false;msg = msg + " Select your Gender";}
if(document.getElementById("s1").value.length < 3 )
{ t1ck=false;msg = msg + " Select one of the games ";}
if(!document.getElementById("c1").checked )
{ t1ck=false;msg = msg + " You must agree to terms & conditions ";}

//alert(msg + t1ck);

if(t1ck){document.getElementById("btnSignUp").disabled = false; }
else{document.getElementById("btnSignUp").disabled = true; }
} 


window.onload = function () { 

var btnSignUp = document.getElementById("btnSignUp");

var t1 = document.getElementById("t1"); 
var r1 = document.getElementById("r1"); 
var r2 = document.getElementById("r2"); 
var s1=document.getElementById("s1");
var c1=document.getElementById("c1");

var t1ck=false;
document.getElementById("btnSignUp").disabled = true;
t1.onkeyup = formValidation; 
r1.onclick = formValidation; 
r2.onclick = formValidation; 
s1.onclick = formValidation; 
c1.onclick = formValidation;
};