Form Validation using javascript in joomla

Posted by Ankur on Stack Overflow See other posts from Stack Overflow or by Ankur
Published on 2010-02-09T12:55:38Z Indexed on 2012/09/26 9:38 UTC
Read the original article Hit count: 260

Filed under:
|
|

I want to use form validation. I have used javascript for this and I have downloaded the com_php0.1alpha-J15.tar component for writing php code but the blank entries are goes to the database. Please guide me... sample code is here...

<script language="javascript" type="text/javascript">
 function Validation()
 {
  if(document.getElementById("name").value=="")
  {
   document.getElementById("nameerr").innerHTML="Enter Name";
   document.getElementById("name").style.backgroundColor = "yellow";
  }
  else
  {
   document.getElementById("nameerr").innerHTML="";
   document.getElementById("name").style.backgroundColor = "White";
  }
  if(document.getElementById("email").value=="")
  {
   document.getElementById("emailerr").innerHTML="Enter Email";
   document.getElementById("email").style.backgroundColor = "yellow";
  }
  else
  {
   document.getElementById("emailerr").innerHTML="";
   document.getElementById("email").style.backgroundColor = "White";
          }
  if(document.getElementById("phone").value=="")
  {
   document.getElementById("phoneerr").innerHTML="Enter Contact No";
   document.getElementById("phone").style.backgroundColor = "yellow";
  }
  else
  {
   document.getElementById("phoneerr").innerHTML="";
   document.getElementById("phone").style.backgroundColor = "White";
                }
  if(document.getElementById("society").value=="")
  {
   document.getElementById("societyerr").innerHTML="Enter Society";
   document.getElementById("society").style.backgroundColor = "yellow";
  }
  else
  {
   document.getElementById("societyerr").innerHTML="";
   document.getElementById("society").style.backgroundColor = "White";
  }
  if(document.getElementById("occupation").value=="")
  {
   document.getElementById("occupationerr").innerHTML="Enter Occupation";
   document.getElementById("occupation").style.backgroundColor = "yellow";
         }
  else
  {
   document.getElementById("occupationerr").innerHTML="";
   document.getElementById("occupation").style.backgroundColor = "White";
         }
  if(document.getElementById("feedback").value=="")
  {
   document.getElementById("feedbackerr").innerHTML="Enter Feedback";
   document.getElementById("feedback").style.backgroundColor = "yellow";
  }
  else
  {
   document.getElementById("feedbackerr").innerHTML="";
   document.getElementById("feedback").style.backgroundColor = "White";
  }
  if(document.getElementById("name").value=="" || document.getElementById("email").value=="" 
  || document.getElementById("phone").value=="" || document.getElementById("society").value=="" 
  || document.getElementById("occupation").value=="" || document.getElementById("feedback").value=="")
   return false;
  else
   return true;
 }


</script>


<?php
 if(isset($_POST['submit']))
 {
   $conn = mysql_connect('localhost','root','');
   mysql_select_db('society_f',$conn);

   $name = $_POST['name'];
   $email =  $_POST['email'];
   $phone =  $_POST['phone'];
   $society =  $_POST['society'];
   $occupation = $_POST['occupation'];
   $feedback =  $_POST['feedback'];

   $qry =  "insert into feedback values(null". ",'" . $name . "','" . $email . "','" . $phone . "','" . $society . "','" . $occupation . "','" . $feedback . "')" ;
   $res = mysql_query($qry);
   if(!$res)
   {
    echo "Could not run a query" . mysql_error(); 
    exit(); 
   }

 }
?>

<!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" />
<title>Untitled Document</title>
<style type="text/css">
 .td{
  background-color:#FFFFFF;
  color:#000066;
  width:100px;
 }
 .text{
  border:1px solid #0033FF;
  color:#000000;
 }
</style>

</head>
<body>
<form id="form1" method="post">
<input type="hidden" name="check" value="post"/>

 <table border="0" align="center" cellpadding="2" cellspacing="2">
  <tr>
   <td colspan="3" style="text-align:center;"><span style="font-size:24px;color:#000066;">Feedback Form</span></td>
  </tr>
  <tr>
   <td class="td">Name</td>
   <td><input type="text" id="name" name="name" class="text" ></td>
   <td style="font-style:italic;color:#FF0000;" id="nameerr"></td>
  </tr>
  <tr>
   <td class="td">E-mail</td>
   <td><input type="text" id="Email" name="Email"  class="text"></td>
   <td style="font-style:italic;color:#FF0000;" id="emailerr"></td>
  </tr>
  <tr>
   <td class="td">Contact No</td>
   <td><input type="text" id="Phone" name="Phone"  maxlength="15" class="text"></td>
   <td style="font-style:italic;color:#FF0000;" id="Phoneerr"></td>
  </tr>
  <tr>
   <td class="td">Your Society</td>
   <td><input type="text" id="society" name="society"  class="text"></td>
   <td style="font-style:italic;color:#FF0000;" id="societyerr"></td>
  </tr>
  <tr>
   <td class="td">Occupation</td>
   <td><input type="text" id="occupation" name="occupation"  class="text"></td>
   <td style="font-style:italic;color:#FF0000;" id="occupationerr"></td>
  </tr>
  <tr>
   <td class="td">Feedback</td>
   <td><textarea name="feedback" id="feedback" class="text"></textarea></td>
   <td style="font-style:italic;color:#FF0000;" id="feedbackerr"></td>
  </tr>
  <tr>
   <td colspan="3" style="text-align:center;">
    <input type="submit" value="Submit" id="submit" onClick="Validation();" />
    <input type="reset" value="Reset" onClick="Resetme();" />
   </td>
  </tr> 
  </table>
</form>
</body>
</html>

© Stack Overflow or respective owner

Related posts about validation

Related posts about forms