Form Validation

jonnyboy

I have built several PHP forms that submit data to a MySQL database.

I really want to perform some form validation to check for empty fields, does not reset the form and allows the user to complete the empty fields and continue with the post.

I have tried various JavaScripts, but they don't seem to work properly.

Any ideas?

Thanks

cgraz

yeah, post your code. It may have been a simple mistake? Are you familiar with javascript, or did you try to get someone elses code to work with your form?

Cgraz

jonnyboy

Thanks....Not very familiar with JavaScript.

Code attached.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
</head>
<style>
body {
color : black;
background-color : white;
background-image : ;
background-position : 0% 0%;
background-repeat : repeat-x;
background-attachment : fixed;
font-family : Arial, Verdana;
font-size : 12px;
font-weight : bold;
text-align : left;
}

form {
color : ;
border-color : blue;
}

table {
color : black;
background-color : white;
background-image : ;
background-position : 0% 0%;
background-repeat : repeat-x;
background-attachment : fixed;
font-family : Arial, Verdana;
font-size : 12px;
font-weight : ;
text-align : left;
}
a:link {
text-decoration : none;
color : #003366;
}
a:visited {
text-decoration : none;
color : #003366;
}
a:hover {
text-decoration : underline;
color : blue;
}
</style>

<body>

<h2>Stop Press - Post</h2>

<table>
<tr>
<td><img src="Images/nav_CloseChilds_L1_154.gif" width="15" height="14" border="0"></td>
<td><a target="content"a href="stop_press_menu.html">Back to Menu</a> or </td>
<td><a target="content"a href="stop_press_get.php">View Posts</a></td>
</tr>
</table>
<BR>

<?php

// Test for user input
if (empty($message_creator) || empty($message_title) || empty ($message_text))
{
?>
<body bgcolor="#ffffff">
<form action="stop_press_post.php" method="GET">
<?
// include 'clean.inc';

function selectDistinct ($connection,
$tableName,
$columnName,
$pulldownName,
$additionalOption,
$defaultValue)
{
$defaultWithinResultSet = FALSE;

 // Query to find distinct values of $columnName
 // in $tableName
 $distinctQuery = "SELECT DISTINCT $columnName
                   FROM $tableName 
				   ORDER by $columnName";

 // Run the distinctQuery on the databaseName
 if (!($resultId = @ mysql_query ($distinctQuery, 
                                  $connection)))
    showerror();

 // Retrieve all distinct values
 $i = 0;
 while ($row = @ mysql_fetch_array($resultId))
    $resultBuffer[$i++] = $row[$columnName];

 // Start the select widget
 echo "\n<select name=\"$pulldownName\">";       

 // Is there an additional option?
 if (isset($additionalOption))
    // Yes, but is it the default option?
    if ($defaultValue == $additionalOption)
       // Show the additional option as selected
       echo "\n\t<option selected>$additionalOption";
    else
       // Just show the additional option
       echo "\n\t<option>$additionalOption";

 // check for a default value
 if (isset($defaultValue))
 {
    // Yes, there's a default value specified

    // Check if the defaultValue is in the 
    // database values
    foreach ($resultBuffer as $result)
       if ($result == $defaultValue)
          // Yes, show as selected
          echo "\n\t<option selected>$result";
       else
          // No, just show as an option
          echo "\n\t<option>$result";
 }  // end if defaultValue
 else 
 { 
    // No defaultValue

    // Show database values as options
    foreach ($resultBuffer as $result)
       echo "\n\t<option>$result";
 }
 echo "\n</select>";

} // end of function

// Connect to the DBMS
if (!($connection = @ mysql_connect($hostname,
$username,
$password)))
die("Could not connect to database");

if (!mysql_select_db("intranet"))
showerror();

echo "\nMessage Creator:";

// Produce the select list
// Parameters:
// 1: Database connection
// 2. Table that contains values
// 3. Attribute that contains values
// 4. <SELECT> element name
// 5. An additional non-database value
// 6. Optional <OPTION SELECTED>
selectDistinct($connection,
"internal_people",
"name",
"message_creator",
"",
"");

<br>
Message Subject:
<br>
<input type="text" name="message_title" size="60" maxlength="60" />
<br>
Message Body:
<br>
<textarea name="message_text" rows="15" cols="69" wrap="physical"></textarea>
<br>
<input type="hidden" name="message_ip" value="<?php echo $REMOTE_ADDR; ?>" />
<input type="hidden" name="dept_key" value="RE">
<br>

<font color="red"<b>All fields must be completed for the message to post</b></p>

<?php
}
else
{
if (!($connection = @ mysql_connect($hostname,
$username,
$password)))
die("Could not connect to database");

if (!mysql_select_db("intranet", $connection))
showerror();

$insertQuery = "INSERT INTO stop_press VALUES
(NULL, " .
"\"" . $dept_key ."\", " .
"\"" . $message_creator ."\", " .
"\"" . $message_title ."\", " .
"\"" . $message_text ."\", " .
"\"" . $message_ip ."\", " .
"NOW())";

if ((@ ($insertQuery,
$connection))
&& @ mysql_affected_rows() == 1)

echo '<h5>Message posted successfully - Thank you</h5>';
else
showerror();
}//if else empty()
?>

</body>
</html>

jonnyboy

Sorry, this is the JScript I was trying to insert before the form. In this particular form, the JScript does not seem to invoke at all?

function verify(f) {
var msg;
var empty_fields = "";
var errors = "";

for(var i = 0; i < f.length; i++) {
    var e = f.elements[i];
    if (((e.type == "text") || (e.type == "textarea")) && !e.optional) {
        if ((e.value == null) || (e.value == "") || isblank(e.value)) {
            empty_fields += "\n          " + e.name;
            continue;
        }

        if (e.numeric || (e.min != null) || (e.max != null)) { 
            var v = parseFloat(e.value);
            if (isNaN(v) || 
                ((e.min != null) && (v < e.min)) || 
                ((e.max != null) && (v > e.max))) {
                errors += "- The field " + e.name + " must be a number";
                if (e.min != null) 
                    errors += " that is greater than " + e.min;
                if (e.max != null && e.min != null) 
                    errors += " and less than " + e.max;
                else if (e.max != null)
                    errors += " that is less than " + e.max;
                errors += ".\n";
            }
        }
    }
}

if (!empty_fields && !errors) return true;

msg  = "______________________________________________________\n\n"
msg += "The form was not submitted because of the following error(s).\n";
msg += "Please correct these error(s) and re-submit.\n";
msg += "______________________________________________________\n\n"

if (empty_fields) {
    msg += "- The following required field(s) are empty:" 
            + empty_fields + "\n";
    if (errors) msg += "\n";
}
msg += errors;
alert(msg);
return false;

}
</script>

cgraz

Ok, I wrote you a little javascript function that validates a form. I created a simple straight-html document using the fields you have in your form so you can see how it works. It's really easy to follow.

<html>

<head>

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

function formValidate(form) {

   if(form.message_creator.value == "") {
      alert('Please select a Message Creator')
      form.message_creator.focus();
      return false;
   }

   if(form.message_title.value == "") {
      alert('Please input a Message Title');
      form.message_title.focus();
      return false;
   }

   if(form.message_text.value == "") {
      alert('Please input Message Body');
      form.message_text.focus();
      return false;
   }

   return true;

}



</script>

</head>

<body>

<form method="post" action="page.php" onSubmit="return formValidate(this);">

<b>Message Creator:</b> <select name="message_creator">
  <option value="">Please Select</option>
  <option value="a">A</option>
  <option value="b">B</option>
  <option value="c">C</option>
</select><br><br>

<b>Message Title:</b> <input type="text" name="message_title" size="45"><br><br>

<b>Message Text: </b><br>
<textarea name="message_text" rows="15" cols="69" wrap="physical"></textarea>  <br><br>

<input type="submit" name="submit" value="Send"">

</form>

</body>

</html>

Just make sure that on your select list, notice how the default value for Please Select is ""

and the function says

if(form.message_creator.value == "") {

If in your html, you change that default option to say

<option value="Please Select">Please Select</option>

Then you need to change that part of the javascript to say

if(form.message_creator.value == "Please Select") {

Cgraz

jonnyboy

Thanks alot for your help on this, I've added the code, but cannot get "Message_Creator" to work as " " blank values, so have changed to "Please select" but of course, the field will not be seen as empty. How do I get the script to see that "Please select", the default value cannot be left.

Hope you can help.

Jonathan

New Code Below...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

form {
color : ;
border-color : blue;
}

function formValidate(form) {

if(form.message_creator.value == "Please select") {
alert('Please select a Message Creator')
form.message_creator.focus();
return false;
}

if(form.message_title.value == "") {
alert('Please input a Message Title');
form.message_title.focus();
return false;
}

if(form.message_text.value == "") {
alert('Please input Message Body');
form.message_text.focus();
return false;
}

return true;

}

</script>

<body>
<h2>Stop Press - Post</h2>

<table>
<tr>
<td><img src="Images/nav_CloseChilds_L1_154.gif" width="15" height="14" border="0"></td>
<td><a target="content"a href="stop_press_menu.html">Back to Menu</a> or </td>
<td><a target="content"a href="stop_press_get.php">View Posts</a></td>
</tr>
</table>
<BR>

<?php

// Test for user input
if (empty($message_creator) || empty($message_title) || empty ($message_text))
{
?>
<body bgcolor="#ffffff">

<?
// include 'clean.inc';

function selectDistinct ($connection,
$tableName,
$columnName,
$pulldownName,
$additionalOption,
$defaultValue)
{
$defaultWithinResultSet = FALSE;

 // Query to find distinct values of $columnName
 // in $tableName
 $distinctQuery = "SELECT DISTINCT $columnName
                   FROM $tableName 
				   ORDER by $columnName";

 // Run the distinctQuery on the databaseName
 if (!($resultId = @ mysql_query ($distinctQuery, 
                                  $connection)))
    showerror();

 // Retrieve all distinct values
 $i = 0;
 while ($row = @ mysql_fetch_array($resultId))
    $resultBuffer[$i++] = $row[$columnName];

 // Start the select widget
 echo "\n<select name=\"$pulldownName\">";       

 // Is there an additional option?
 if (isset($additionalOption))
    // Yes, but is it the default option?
    if ($defaultValue == $additionalOption)
       // Show the additional option as selected
       echo "\n\t<option selected>$additionalOption";
    else
       // Just show the additional option
       echo "\n\t<option>$additionalOption";

 // check for a default value
 if (isset($defaultValue))
 {
    // Yes, there's a default value specified

    // Check if the defaultValue is in the 
    // database values
    foreach ($resultBuffer as $result)
       if ($result == $defaultValue)
          // Yes, show as selected
          echo "\n\t<option selected>$result";
       else
          // No, just show as an option
          echo "\n\t<option>$result";
 }  // end if defaultValue
 else 
 { 
    // No defaultValue

    // Show database values as options
    foreach ($resultBuffer as $result)
       echo "\n\t<option>$result";
 }
 echo "\n</select>";

} // end of function

// Connect to the DBMS
if (!($connection = @ mysql_connect($hostname,
$username,
$password)))
die("Could not connect to database");

if (!mysql_select_db("intranet"))
showerror();

echo "\nMessage Creator:";

?>
<br>

<br>
Message Subject:
<br>
<input type="text" name="message_title" size="60" maxlength="60" />
<br>
Message Body:
<br>
<textarea name="message_text" rows="15" cols="69" wrap="physical"></textarea>
<br>
<input type="hidden" name="message_ip" value="<?php echo $REMOTE_ADDR; ?>" />
<input type="hidden" name="dept_key" value="RE">
<br>

<font color="red"<b>All fields must be completed for the message to post</b></p>

<?php
}
else
{
if (!($connection = @ mysql_connect($hostname,
$username,
$password)))
die("Could not connect to database");

if (!mysql_select_db("intranet", $connection))
showerror();

if ((@ ($insertQuery,
$connection))
&& @ mysql_affected_rows() == 1)

echo '<h5>Message posted successfully - Thank you</h5>';
else
showerror();
}//if else empty()
?>

</body>
</html>