Web Design

                                JAVASCRIPT validations

 

Radio button validation


use same name to both radio buttons

in .js file 


function val_radio()
{
    if((document.form1.gender[0].checked==false)&& (document.form1.gender[1].checked==false))
    {
        alert("Please Select Sex");
        return false;
    }
    if(document.form1.gender[0].checked==true)
    {
        alert("male");
        var gender="male";
    }
    if(document.form1.gender[1].checked==true)
    {
        alert("female");
        var gender="female";
    }
    alert("your detials are accepted..")
document.write("your gender is "+gender);   
}

in .html file

<html>

<script language="javascript" type="text/javascript" src="val_radio.js">
</script>
</head>
<body>
<form name="form1" action="" onsubmit="return val_radio()">
gender:
<input type="radio" name="gender" value="male"/>male
<input type="radio" name="gender" value="female"/>female
<input type="submit" name="submit" value="submit"/>
</form>
</body>
</html>


 

Check Box validation 


in checkbox.js file

function checkbox()
{
    if(document.form1.driver[0].checked==false && document.form1.driver[1].checked==false)
    {
        alert("please choose your driving type")
        return false;
    }
    if(document.form1.driver[0].checked==true)
    {
        dtype="need Driver";
    }
    if(document.form1.driver[1].checked==true)
    {
        dtype="self Driver";
    }
    document.write("driving type is " + dtype);
}

in checkbox.html file

<html>
<head>
<script language="javascript" type="text/javascript" src="checkbox.js">
</script>
</head>
<body>
<form name="form1" method="post" onsubmit="return checkbox()">
<table>
<tr>
  <td>Driving type </td>
    <td><input name="driver" type="checkbox" />Need a Driver</td>
  </tr>
  <tr>
    <td></td>
    <td><input name="driver" type="checkbox"/>self Driver</td>
    </tr>
    <tr>
    <td><input type="submit" name="check" value="check"/></td>
    </tr>
</table>
</form>
</body>
</html>

 Drop Box validation


in dropbox.js fle

function dropbox()
{
if(document.form1.jumpMenu.selectedIndex==0)
{
alert("Please select item from first list.");
document.form1.jumpMenu.focus();
return false;
}
if(document.form1.jumpMenu.selectedIndex==1)
{
    var type="car";
}
if(document.form1.jumpMenu.selectedIndex==2)
{
    var type="van";
}
if(document.form1.jumpMenu.selectedIndex==3)
{
    var type="jeep";
}
alert("right");
document.write("your type is "+ type);   
}


in dropbox.html file

</html>
<head>
<script language="javascript" type="text/javascript" src="dropbox.js">
</script>
</head>
<head>
<body>
<form method="post" name="form1" onsubmit="return dropbox()">
<select name="jumpMenu" id="jumpMenu" >
        <option value=""></option>
      <option value="car" >Car</option>
      <option value="van">Van</option>
      <option value="jeep">Jeep</option>
    </select>
    <input type="submit" name="select" value="select">
</form>
</body>
</html>


JS validations examples 


JS_validations.rar JS_validations.rar
Size : 0.854 Kb
Type : rar

This free website was made using Yola.

No HTML skills required. Build your website in minutes.

Go to www.yola.com and sign up today!

Make a free website with Yola