Insert Operation Using php mysql with Java Script Validation

Insert Operation Using php mysql with Java Script Validation:

insert operation using php
In this program contains Perfect Insert operation from Html form to My Sql . In this post i am using Javascript for Form Validation.

Using this program you have to learn how to insert the data using php and mysql.

Program Code:.

create database:

CREATE DATABASE 'getinsearch'

create Table:

CREATE TABLE  `getinsearch`.`san` (
`companyname` VARCHAR( 150 ) NOT NULL ,
`address` VARCHAR( 350 ) NOT NULL ,
`contactnumber` INT( 200 ) NOT NULL ,
`mail` VARCHAR( 200 ) NOT NULL ,
`url` VARCHAR( 150 ) NOT NULL ,
`category` VARCHAR( 80 ) NOT NULL
) ENGINE = MYISAM ;


Index.php:


<?php
include("db.php");
if(isset($_POST['submit']))
{
$name=$_POST['company1'];
$address=$_POST['address1'];
$contact=$_POST['contact1'];
$mail=$_POST['email1'];
$url=$_POST['url1'];
$category=$_POST['category1'];
$insert=mysql_query("insert into san(companyname,address,contactnumber,mail,url,category)values('$name','$address','$contact','$mail','$url','$category')");
if($insert)
{
echo "<script>alert('inserted success')</script>";
}
else
{
echo "<script>alert('inserted failure')</script>";
}
}
?>




<script type="text/javascript">
function validation()
{
var company1=document.insertform.company1.value;//document.getElementById('name').value
if(company1=="")
{
alert('Please Enter Company Name');
//document.getElementById('san').innerHTML="please enter the name";
document.insertform.company1.focus();
return false;
}
var address1=document.insertform.address1.value;
if(address1=="")
{
alert('Plese Enter Address');
document.insertform.address1.focus();
return false;
}
var contact1=document.insertform.contact1.value;
if(contact1=="")
{
alert('Please Enter Contact Number');
document.insertform.contact1.focus();
return false;
}
/*<!--else
{
var pra=/^([0-9_\-\.\+\,])$/;
if(pra.test(contact1)==false)
{
alert('Enter Correct Contact Number');
document.insertform.contact1.focus();
return false; 
}
}-->*/
var email1=document.insertform.email1.value;
if(email1=="")
{
alert('Please Enter Email ID');
document.insertform.email1.focus();
return false;
}
else
{
var ex=/^(([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4}))$/;
 if(ex.test(email1)==false)
 {
  alert('Please Enter Valid Email ID');
document.insertform.email1.focus();
return false;
 }
}
var url1=document.insertform.url1.value;
if(url1=="")
{
alert('Please Enter Url');
document.insertform.url1.focus();
return false;
}
var category1=document.insertform.category1.value;
if(category1=="")
{
alert('Please Enter Category');
document.insertform.category1.focus();
return false;
}


}


</script>
<?php include('head.php')?>
<div align="center" style="width:2050px;">

</div>

<div class="center">
<h1 style="margin-left:50px; text-decoration:underline; text-align:center;">Insert Data </h1>

<form action="" method="post" onsubmit="return validation()"  name="insertform" >
<strong class="lab">Company Name:</strong> <input class="textbox" type="text"  name="company1" style="margin-left:72px; "><br /><br />
<strong class="lab">Address:</strong> <input class="textbox" type="text" name="address1" style="margin-left:138px;"><br /><br />
<strong class="lab">Contact Numbers:</strong> <input class="textbox" type="text" name="contact1"  style="margin-left:60px;"><br /><br />
<strong class="lab">Email ID:</strong> <input class="textbox" type="text" name="email1" style="margin-left:129px;"><br /><br />
<strong class="lab">Website ID:</strong> <input class="textbox" type="text" name="url1" style="margin-left:110px;"><br /><br />
<strong class="lab">Category:</strong> <input class="textbox" type="text" name="category1" style="margin-left:128px;"><br /><br />
<input type="submit" class="submit" name="submit" id="submit" value="Insert">

</form>

</div>



<?php include('foot.php')?>



head.php:

<!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=iso-8859-1" />
<link rel="stylesheet" href="style.css" />
<title>Insert Data to Database</title>
<meta name="description" content="san insert data to database">



<meta name="author" content="getinn">
<meta charset="UTF-8">

</head>

<body>
<div class="head">
<BR />
<marquee style="color:#FFFFFF; letter-spacing:1PX;">How to insert data Form to database using php and mysql with Javascript Validation</marquee>

</div>

foot.php:




<div class="footer">
<br><br>
<p style="color:#FEFEFE; text-align:right; margin-right:80px;">Copyright &copy; 2014 | san web corner  &nbsp;<a href="http://www.sanwebtutorials.blogspot.in/">san web corner</a></p>
</div>

</body>
</html>
db.php:
<?php

$conn=mysql_connect("localhost", "root", "") or die("Error connecting to database: ".mysql_error());
$db=mysql_select_db("getinsearch")or die('Database not connected');
?>

style.css



html, body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  background-color:#FFFFFF;
}
.head
{
background-color:#a0c631;
height:60px;
}
.footer
{
background-color:#a0c631;
height:120px;
}






table
{
margin:0 auto;
font-family:Tahoma, Geneva, sans-serif;
margin-top:5px;
}


#text
{
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
height:40px;
border: 1px solid #898989;
}
#search {

font-size: 14px;
color:#FFFFFF;
padding: 12px 38px;
background: -moz-linear-gradient(
top,
#1d8cb1 0%,
#0f7ea3);
background: -webkit-gradient(
linear, left top, left bottom, 
from(#7c9b20),
to(#8eb420));
border: 1px solid #518206;
}
#search:hover
{
background:#5C9607;
}

.sansearch
{
width:500px;
size:10px;
margin-left:auto;
margin-right:auto;
}


.center
{
height:440px;
width:700px;
margin-left:auto;
margin-right:auto;
margin-top:50px;
margin-bottom:50px;
border:1px solid #B8B8B8;
border-radius:10px;




}

.container
{
width:1100px;
margin-left:auto;
margin-right:auto;
}


.san
{
width:800px;
margin-left:auto;
margin-right:auto;
border:1px solid #E3E3E3;
border-radius:10px;
height:auto;
line-height:20px;
padding-left:60px;
min-height:80px;
padding-top:10px;
padding-bottom:40px;
line-height:32px;
font-size:18px;





}

.textbox
{
height:30px;
width:300px;
border:1px solid #340001;
}
.lab
{
font-size:19px;
color:#050505;
font-weight:bold;
margin-left:50px;
}

.submit
{
height:30px;
width:100px;
border:1px solid #D3D3D3;
margin-left:350px;
margin-top:10px;


background-color:#6A9511;
color:#FFFFFF;
}


db.php:

<?php

$conn=mysql_connect("localhost", "root", "") or die("Error connecting to database: ".mysql_error());
$db=mysql_select_db("getinsearch")or die('Database not connected');
?>


Download Code


Post a Comment

0 Comments