JavaScript-form-validation using PHP
Create Db Of Name "form-validation"
After that you need to create table:
CREATE TABLE reg_table
(
id int NOT NULL AUTO_INCREMENT,
userid varchar(255) ,
passid varchar(255),
username varchar(255),
address varchar(255),
country varchar(255),
zip int(255),
email varchar(255),
sex varchar(255),
language1 varchar(255),
descr varchar(255),
PRIMARY KEY (id)
)
Create File Name Write As "Index.Php"
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8">
<title>JavaScript Form Validation using a sample registration form</title>
<meta name="keywords" content="example, JavaScript Form Validation, Sample registration form" />
<meta name="description" content="This document is an example of JavaScript Form Validation using a sample registration form. " />
<link rel='stylesheet' href="style.css" type='text/css' />
<script src="js script.js"></script>
</head>
<body onLoad="document.registration.userid.focus();">
<h1>Registration Form</h1>
<p>Use tab keys to move from one input field to the next.</p>
<form name='registration' action="insert.php" method="post" onSubmit="return formValidation();" >
<ul>
<li><label for="userid">User id:</label></li>
<li><input type="text" name="userid" size="12" /></li>
<li><label for="passid">Password:</label></li>
<li><input type="password" name="passid" size="12" /></li>
<li><label for="username">Name:</label></li>
<li><input type="text" name="username" size="50" /></li>
<li><label for="address">Address:</label></li>
<li><input type="text" name="address" size="50" /></li>
<li><label for="country">Country:</label></li>
<li>
<select name="country">
<option selected="" value="Default">(Please select a country)</option>
<option value="AF">Afghanistan (افغانستان)</option>
<option value="AL"Albania (Shqipëri)</option>
<option value="DZ">Algeria</option>
<option value="AS">American Samoa</option>
<option value="GR">Greece (Ελλάδα)</option>
</select></li>
<li><label for="zip">ZIP Code:</label></li>
<li><input type="text" name="zip" /></li>
<li><label for="email">Email:</label></li>
<li><input type="text" name="email" size="50" /></li>
<li><label id="gender">Sex:</label></li>
<li><input type="radio" name="sex" value="Male" /><span>Male</span></li>
<li><input type="radio" name="sex" value="Female" /><span>Female</span></li>
<li><label>Language:</label></li>
<li><input type="checkbox" name="language1" value="English" checked /><span>English</span></li>
<li><input type="checkbox" name="language1" value="Non English" /><span>Non English</span></li>
<li><label for="desc">About:</label></li>
<li><textarea name="desc" id="desc"></textarea></li>
<li><input type="submit" name="DONE" value="Submit" /></li>
</ul>
</form>
</body>
</html>
Create File Name Write As "style.css"
h1 {
margin-left: 70px;
}
form li {
list-style: none;
margin-bottom: 5px;
}
form ul li label{
float: left;
clear: left;
width: 100px;
text-align: right;
margin-right: 10px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
}
form ul li input, select, span {
float: left;
margin-bottom: 10px;
}
form textarea {
float: left;
width: 350px;
height: 150px;
}
[type="submit"] {
clear: left;
margin: 20px 0 0 230px;
font-size:18px
}
p {
margin-left: 70px;
font-weight: bold;
}
Create File Name Write As "js script.js"
function formValidation()
{
var uid = document.registration.userid;
var passid = document.registration.passid;
var uname = document.registration.username;
var uadd = document.registration.address;
var ucountry = document.registration.country;
var uzip = document.registration.zip;
var uemail = document.registration.email;
var umsex = document.registration.msex;
var ufsex = document.registration.fsex;
if(userid_validation(uid,5,12))
{
if(passid_validation(passid,7,12))
{
if(allLetter(uname))
{
if(alphanumeric(uadd))
{
if(countryselect(ucountry))
{
if(allnumeric(uzip))
{
if(ValidateEmail(uemail))
{
if(validsex(umsex,ufsex))
{
}
}
}
}
}
}
}
}
return false;
}
function userid_validation(uid,mx,my)
{
var uid_len = uid.value.length;
if (uid_len == 0 || uid_len >= my || uid_len < mx)
{
alert("User Id should not be empty / length be between "+mx+" to "+my);
uid.focus();
return false;
}
return true;
}
function passid_validation(passid,mx,my)
{
var passid_len = passid.value.length;
if (passid_len == 0 ||passid_len >= my || passid_len < mx)
{
alert("Password should not be empty / length be between "+mx+" to "+my);
passid.focus();
return false;
}
return true;
}
function allLetter(uname)
{
var letters = /^[A-Za-z]+$/;
if(uname.value.match(letters))
{
return true;
}
else
{
alert('Username must have alphabet characters only');
uname.focus();
return false;
}
}
function alphanumeric(uadd)
{
var letters = /^[0-9a-zA-Z]+$/;
if(uadd.value.match(letters))
{
return true;
}
else
{
alert('User address must have alphanumeric characters only');
uadd.focus();
return false;
}
}
function countryselect(ucountry)
{
if(ucountry.value == "Default")
{
alert('Select your country from the list');
ucountry.focus();
return false;
}
else
{
return true;
}
}
function allnumeric(uzip)
{
var numbers = /^[0-9]+$/;
if(uzip.value.match(numbers))
{
return true;
}
else
{
alert('ZIP code must have numeric characters only');
uzip.focus();
return false;
}
}
function ValidateEmail(uemail)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(uemail.value.match(mailformat))
{
return true;
}
else
{
alert("You have entered an invalid email address!");
return false;
}
}
function validsex(umsex,ufsex)
{
x=0;
if(umsex.checked)
{
x++;
}
if(ufsex.checked)
{
x++;
}
if (x==2)
{
alert('Both Male/Female are checked');
ufsex.checked=false
umsex.checked=false
umsex.focus();
return false;
}
if(x==0)
{
alert('Select Male/Female');
umsex.focus();
return false;
}
else
{
alert('Form Succesfully Submitted');
window.location.reload()
return true;
}
}
Create File Name Write As "insert.Php"
<?php
mysql_connect("localhost","root","");
$db = mysql_select_db("form-validation");
if(!$db)
{
echo "NOT CONNECTED";
}
else
{
echo "CONNECTED";
}
if(isset($_POST['DONE']))
{
$userid = $_POST['userid'];
$passid = $_POST['passid'];
$username = $_POST['username'];
$address = $_POST['address'];
$country = $_POST['country'];
$zip = $_POST['zip'];
$email = $_POST['email'];
$sex = $_POST['sex'];
$descr = $_POST['desc'];
$language1 = $_POST['language1'];
$insert = mysql_query("INSERT INTO `reg_table`
(`userid`, `passid`, `username`, `address`, `country`, `zip`, `email`, `sex`, `language1` ,`descr`)
VALUES ('$userid','$passid','$username','$address','$country','$zip','$email','$sex','$language1','$descr')");
if(!$insert)
{
echo "error".mysql_error();
}
else
{
echo "insert";
header("location:index.html");
}
}
?>
No comments:
Post a Comment