Monday, 30 November 2015

Registration form with Java Script Validation and Id generation

Dear Friends,

Designing an HTML form with Java script validation and associated PHP code will eat much of our coding time. So a cut and paste code will prove to be useful in this regard.

Here the steps can be spitted to 3
1. Form creation and JS Validation
2. DB and Table creation
3. PHP Code to save it.

Step I. 
HMTL Code for the same - index.php


<html>
<head>
<!--
Coded by Prof. Sajeev Jaladharan
Date : 27.11.2015
email: sajeevjal@gmail.com
-->
<title>SNIT MCA Online Registration</title>

<script language="javascript" type="text/javascript">


function echeck(str) {

        var at="@"
        var dot="."
        var lat=str.indexOf(at)
        var lstr=str.length
        var ldot=str.indexOf(dot)
        if (str.indexOf(at)==-1){
           alert("Invalid E-mail ID")
           return false
        }

        if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
           alert("Invalid E-mail ID")
           return false
        }

        if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
            alert("Invalid E-mail ID")
            return false
        }

         if (str.indexOf(at,(lat+1))!=-1){
            alert("Invalid E-mail ID")
            return false
         }

         if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
            alert("Invalid E-mail ID")
            return false
         }

         if (str.indexOf(dot,(lat+2))==-1){
            alert("Invalid E-mail ID")
            return false
         }

         if (str.indexOf(" ")!=-1){
            alert("Invalid E-mail ID")
            return false
         }

          return true
    }


function checkform()
{
alert('HUP');

    if (document.reg.Name.value=="")
    {
        // something is wrong
        alert('Enter first name ');
        document.reg.Name.focus();
        return false;
    }
   
else if (document.reg.Housename.value=="")
    {
        // something is wrong
        alert('Enter Housename');
        document.reg.Housename.focus();
        return false;
}
else if (document.reg.Residence.value=="")
    {
        // something is wrong
        alert('Enter Addressline2 number');
        document.reg.Residence.focus();
        return false;
}
else if (document.reg.City.value=="")
    {
        // something is wrong
        alert('Enter City name');
        document.reg.City.focus();
        return false;
}
else if (document.reg.State.value=="")
    {
        // something is wrong
        alert('Enter State name');
        document.reg.State.focus();
        return false;
}
else if (document.reg.Pin.value=="")
    {
        // something is wrong
        alert('Enter Pin Number');
        document.reg.Pin.focus();
        return false;
}
else if ((document.reg.Email.value==null)||(document.reg.email.value==""))
{
        alert("Enter your Email ID");
        document.reg.Email.focus();
        return false;
}

else if(echeck(document.reg.Email.value)==false)
{

    alert('Enter email address properly \n[abc@abc.com]\nyourname@hostname.domainname\nExample:\nname@gmail.com');
    document.reg.Email.focus();
    return false;
}

else if (document.reg.Land.value=="")
    {
        // something is wrong
        alert('Enter Land phone information');
        document.reg.Land.focus();
        return false;
}
else if (document.reg.Mobile1.value=="")
    {
        // something is wrong
        alert('Enter Student Mobile phone information');
        document.reg.Mobile1.focus();
        return false;
}
else if (document.reg.Mobile2.value=="")
    {
        // something is wrong
        alert('Enter Parent Mobile phone information');
        document.reg.Mobile2.focus();
        return false;
}
else if (document.reg.Qualification.value=="")
    {
        // something is wrong
        alert('Enter Qualification information');
        document.reg.Qualification.focus();
        return false;
}
else if (document.reg.Subject.value=="")
    {
        // something is wrong
        alert('Enter Subject information');
        document.reg.Subject.focus();
        return false;
}

else if (document.reg.College.value=="")
    {
        // something is wrong
        alert('Enter College information');
        document.reg.College.focus();
        return false;
}
/* */
//document.reg.id.disabled=false;
return true;
}

</script>
</head>
<body background="img.jpg" >
<table border=0 width=63% align="center" bgcolor="#EFFBFC">
<tr><td>

<form name="reg" class="wufoo topLabel page" method="post" action="saveadmission.php" onSubmit="return checkform()">
  <table style="border-color:#669999;border-style:dashed ;" align="center" cellpadding="2" cellspacing="2" width="85%">
    <tbody>
    <tr>
      <td>Name </td>
      <td><input id="Name" name="Name" style="width:150px" size="20" tabindex="2" type="text"></td></tr>
   
      <td colspan="2"><strong><blockquote class="style1"><span>For Communication Purpose</span></blockquote></strong></td></tr>
    <tr>
      <td>House Name </td>
      <td><span class="full addr1">
        <input id="Housename" name="Housename" style="width:150px" class="field text addr" tabindex="6" type="text">
      </span></td></tr>
    <tr><td>Residence Name & No </td>
      <td><span class="full addr2">
        <input id="Residence" style="width:150px" name="Residence" class="field text addr" tabindex="7" type="text">
      </span></td></tr>
    <tr>
      <td>City</td>
      <td><span class="full addr1">
        <input id="City" name="City" style="width:150px" class="field text addr" tabindex="8" type="text">
      </span></td></tr>
    <tr><td>State</td>
      <td><span class="full addr2">
        <input id="State" style="width:150px" name="State" class="field text addr" tabindex="9" type="text">
      </span></td></tr>
    <tr>
      <td>Pin </td>
      <td><span class="left">
        <input id="Pin" style="width:150px" name="Pin" class="field text addr" maxlength="10" tabindex="10" type="text">
      </span></td></tr>
    <tr><td>Email Address </td>
      <td><span class="left">
        <input id="email" style="width:150px" name="Email" tabindex="11" class="field text addr" maxlength="27" type="text">
      </span></td></tr>
    <tr>
      <td colspan="2"><strong><blockquote class="style1"><span>Contact Numbers</span></blockquote></strong></td></tr>
    <tr>
      <td>Land number [put NA if No Land Phone] </td>
      <td><input id="Land" style="width:150px" name="Land" class="field text" size="15" maxlength="10" tabindex="12" type="text"></td></tr>
        <td>Mobile Number of Student </td>
          <td><input id="Mobile1" style="width:150px" name="Mobile1" class="field text" size="15" maxlength="13" tabindex="13" type="text"></td></tr>
  
<tr><td>Mobile Number of Parent </td>
          <td><input id="Mobile2" style="width:150px" name="Mobile2" class="field text" size="15" maxlength="13" tabindex="13" type="text"></td></tr>
     
    <tr bordercolor="#6699CC">
      <td colspan="2"><strong><blockquote class="style1"><span>Under Graduate Course Details</span></blockquote></strong></td></tr>
    <tr bordercolor="#6699CC">
      <td>Basic Qualification </td>
      <td><label>
        <select name="Qualification" id="Qualification"  tabindex="17" >
          <option selected="selected" value="BSC">BSC</option>
          <option value="BCA">BCA</option>
          <option value="BCOM">BCOM</option>
          <option value="Others">Others</option>
        </select>
      </label></td></tr>
    <tr><td>Degree Subject </td>
      <td><span class="     ">
        <input name="Subject" style="width:150px" id="Subject" type="text"  tabindex="18" >
      </span></td></tr>
   
    <tr><td>College of Current Study </td>
      <td><span class="     ">
        <input name="College" style="width:150px" id="College" type="text"  tabindex="20" >
      </span></td></tr>
  
      <td colspan="2"><div align="center">
        <input name="Save" id="Save" value="Save Data" type="submit" tabindex="21">
        <label>
        <input name="Reset" value="Clear Form" type="reset">
        </label>
      </div></td></tr>
  </tbody></table>
  <div class="info" align="center">
</div>
</form>
</td></tr></table>
</body>
</html>

Design
-------------

Step II
Creation of DB- Take phpmyadmin console and type the database name "snit" in the box provided. 
[NB: Database need to be created only once]
----------------------------------------------------------------------------------------------------


 Create Table
-----------------
SQL : 

CREATE TABLE IF NOT EXISTS `student` (
  `id` int(3) NOT NULL,
  `Name` tinytext NOT NULL,
  `Housename` tinytext NOT NULL,
  `Residence` tinytext NOT NULL,
  `City` tinytext NOT NULL,
  `State` tinytext NOT NULL,
  `Pin` tinytext NOT NULL,
  `Email` tinytext NOT NULL,
  `Land` tinytext NOT NULL,
  `Mobile1` tinytext NOT NULL,
  `Mobile2` tinytext NOT NULL,
  `Qualification` tinytext NOT NULL,
  `Subject` tinytext NOT NULL,
  `College` text NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

After the creation of the Database, you click the SQL tab shown in the figure and copy the above SQL query and paste in the box provided in the screen and press GO.



Step III
PHP code to Save   -  saveadmission.php
------------------------------------------------------------------
<html >
<body>
<!--
Coded by Prof. Sajeev Jaladharan
Date : 27.11.2015
email: sajeevjal@gmail.com
-->
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p><p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p><p>&nbsp;</p>
<p>&nbsp;</p>
<?php

$con = mysql_connect("localhost","root","");

if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("snit",$con);


$Name=$_POST['Name'];

$Housename=$_POST['Housename'];

$Residence=$_POST['Residence'];

$City=$_POST['City'];

$State=$_POST['State'];

$Pin=$_POST['Pin'];

$Email=$_POST['Email'];

$Land=$_POST['Land'];

$Mobile1=$_POST['Mobile1'];

$Mobile2=$_POST['Mobile2'];


//email address is set as the username

$Qualification=$_POST['Qualification'];

$Subject=$_POST['Subject'];

$College=$_POST['College'];

$id=0;
$sql="select max(id)+1 as maxid from student";
$data=mysql_query($sql,$con);

while($row=mysql_fetch_array($data))
{
    $id=$row['maxid'];
}




$sql1="INSERT INTO `snit`.`student` (`id`, `Name`, `Housename`, `Residence`, `City`, `State`,`Pin`, `Email`, `Land`, `Mobile1`, `Mobile2`, `Qualification`, `Subject`, `College`) VALUES ('$id', '$Name', '$Housename', '$Residence', '$City', '$State', '$Pin', '$Email', '$Land', '$Mobile1', '$Mobile2', '$Qualification', '$Subject','$College')";


if (!mysql_query($sql1,$con))
  {
  die('Error: ' . mysql_error());

  }


echo "<center>Congrats...Your data saved. Thank you. Wishing you all the best </center>";
mysql_close($con);

?>


<p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p><p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p><p>&nbsp;</p>
<p>&nbsp;</p>


</body>
<?php
echo "<script>alert('Thanks for Registration'); </script>";

echo "<script>location.href='index.php';</script>";
?>
</html>
 
 NB: Put these files in the project folder inside 'WWW' folder of WAMP/LAMP/XAMPP
mail me for more clarifications : sajeevjal@gmail.com

Wednesday, 25 November 2015

PHP File Upload

Hi All,
If you want to upload one image using PHP, here is the smallest code. This consists of two files.
a) One file for selection of upload image and

b) other is the php code to upload the file

a) Upload image file

<!DOCTYPE html>
<html>
<body>

<form action="upload.php" method="post" enctype="multipart/form-data">
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" value="Upload Image" name="submit">
</form>

</body>
</html>

b) PHP code to upload the file to your own folder in the  name 'hup.jpg' [No conditions checked]

<?php
$target_dir = "uploads/";
$target_file=$target_dir .'hup.jpg';
move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file) or die('Error'.mysql_error());
header('location:home.php');
?>

Thursday, 19 November 2015

PHP DB Create Insert Delete Update Select Queries

1. Simple code to Create Table


NB: Make sure that the usename root , pasword root and database name SNIT can change across different machines.

<?php

$con=mysql_connect("localhost","root","root");
mysql_select_db("SNIT",$con);
mysql_query("create table student(name TEXT(20),rollno int(3),marks int(3))");

?>


2. Simple code to Insert into the table

<?php

$con=mysql_connect("localhost","root","root");
mysql_select_db("SNIT",$con);
mysql_query("insert into student values('ARJUN',108,100)");

?>

3. Simple code to View the content of the table


<?php

$con=mysql_connect("localhost","root","");
mysql_select_db("SNIT",$con);
$sql="Select * from student";
$data=mysql_query($sql,$con);
echo "<table border=1 align=center width=50%>";
echo "<tr><th>Name</th><th>Roll No</th><th>Marks</th></tr>";
while($row=mysql_fetch_array($data))
{
$name=$row['name'];
$rollno=$row['rollno'];
$marks=$row['marks'];

echo "<tr><td>$name</td><td>$rollno</td><td>$marks</td></tr>";

}

mysql_close($con);

?>

MySQL DB and Table Creation


In Ubundu

Step1 : type localhost/phpmyadmin - in the browser

Step2 : Use root as the username and root as the password

Step3: Give a Database name as SNIT


Step4: Press create Button, and Give the table name as Student and number of fields as 3

Step4: Press Go Button and give 3 fields name, rollno and marks

Step5: Press Save button and see the new table created
Step6: You can click the table name to see the contents stored in this table in future.

PHP DB Connectivity

In order to connect your program with DB you need one database and table in your Server

1. Simple code without Form


<?php

$con=mysql_connect("localhost","root","root");
mysql_select_db("SNIT",$con);
mysql_query("insert into student values('ARJUN',108,100)");

?>


Save this file as save.php and execute the program .


2. Simple Code withForm

Will be updated Soon.



PHP : How to execute

In Ubundu

Step1 : Locate the folder /var/www/ in your Root folder

Step2 : Create a folder SNIT [or your own folder] if there is no such folder

Step3. Create a Sub folder [studentproject] in the name of your Project. [So that you can manage your project]

Step 4. Save php files in that folder

Step5. Go to Browser

Step5. type 'localhost' in the url part

Step6. Then you will get a screen "It Works" - which indicate that your Apache Webserver is running.

Step7. type localhost/SNIT/studentproject/form.php

Step8. Now you will see the output in the screen


In Windows
------------------

Step1 : Click the Wampserver tray icon
Step2 : Select WWW Directory

Step3: Create a project folder studentproject under SNIT folder

Step 4: Save your files there

Step5: Type in the browser : localhost/SNIT/studentproject/form.php

Wednesday, 18 November 2015

PHP Basics

Dear All,
Congratulations...
Your are here for a good purpose and I promise maximum support....


Let us start PHP basics..

1. Variables and usages. - start.php

<?php



//Display Help in the browser

$hup='Help';
echo $hup;



?>

2. Loops - Factorial of a number - fact.php


<?php

//Display factorial of 9

$n=9;
$f=1;
$i=1;

while($i<=$n)

{
$f=$f*$i;
$i=$i+1;

}

echo "Factorial is ". $f;

?>

3. Factorial of a number using Form input [Need two files 1. Form file 2. Php file]

form.php


<html>
<body>
<form action=findfactorial.php method=post>
<input type=text name=no ><input type=submit vaule='Find Factorial'>
</form>
</body>
</html>
---------------
findfactorial.php


<?php

//Display factorial of 9

$n=$_POST['no'];
$f=1;
$i=1;

while($i<=$n)

{
$f=$f*$i;
$i=$i+1;

}

echo "Factorial is ". $f;

?>