使用joomla中的javascript进行表单验证

时间:2010-02-09 12:55:38

标签: validation forms joomla

我想使用表单验证。我已经使用了javascript,我已经下载了用于编写php代码的com_php0.1alpha-J15.tar组件,但空白条目将转到数据库。 请指导我...... 示例代码在这里......

<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>

2 个答案:

答案 0 :(得分:1)

以下是有关此问题的joomla文档的链接。它具有内置的表单验证机制。 这是为joomla 1.5 http://docs.joomla.org/Client-side_form_validation

对于joomla 1.6 http://docs.joomla.org/API16:JForm/validate

答案 1 :(得分:0)

更改代码的这一行:

<input type="submit" value="Submit" id="submit" onClick="Validation();" />

有了这个:

<input type="submit" value="Submit" id="submit" onClick="return Validation();" />

.....

或者,您可以将此函数名称放在表单标记中,例如:

<form id="form1" method="post" onSubmit="return Validation();">

并保留提交按钮代码,如下所示:

<input type="submit" value="Submit" id="submit" />

如果您已正确完成其他所有操作,则应解决验证问题。