2 replies to this topic

[xynapse]

Hi,

I have created a contact form that works using HTML php and css. I was wondering how I could go about making a dialog box shows up after the user submits the form that would show either success or the errors providing by the error handling in the php code. Here is my form code.

index.html

 <!-- CONTACT FORM -->

 

        <h2>Contact Form</h2>

        <form id="form1"  action="contact.php" enctype="multipart/form-data" method="post" onsubmit="return confirm('You entered your e-mail address as:\n\n' + document.getElementById('email').value + '\n\nSelect OK if correct or Cancel to edit.')">

          <label>

            <input  type="text" name="name" value="Name:">

          </label>

          <label>

            <input  type="text" name="telephone" value="Phone:">

          </label>

          <label>

            <input  type="text" name="email" value="email">

          </label>

          <label class="text">

            <input  type="text" name="comments" value="Type Message"></tex>

          </label>

          <span class="btns"> <a href="#" rel="reset">Clear</a> <a href="#"rel="submit">Send</a> </span>

        </form>

contact.php

<?php

if(isset($_POST['email'])) {

	

	//Email

	$email_to = "email@email.com";

	$email_subject = "CG Contact Form Submission";

	

	

	function died($error) {

		// error message code 

		echo "We are very sorry, but there were error(s) found with the form your submitted. ";

		echo "These errors appear below.<br /><br />";

		echo $error."<br /><br />";

		echo "Please go back and fix these errors.<br /><br />";

		die();

	}

	

	// validation expected data exists

	if(!isset($_POST['name']) ||

		!isset($_POST['email']) ||

		!isset($_POST['telephone']) ||

		!isset($_POST['comments'])) {

		died('We are sorry, but there appears to be a problem with the form your submitted.');		

	}

	

	$name = $_POST['name']; // required

	$email_from = $_POST['email']; // required

	$telephone = $_POST['telephone']; // not required

	$comments = $_POST['comments']; // required

	

	$error_message = "";

	$email_exp = "^[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$";

  if(!eregi($email_exp,$email_from)) {

  	$error_message .= 'The Email Address you entered does not appear to be valid.<br />';

  }

	$string_exp = "^[a-z .'-]+$";

  if(!eregi($string_exp,$name)) {

  	$error_message .= 'The Name you entered does not appear to be valid.<br />';

  }

  

  if(strlen($comments) < 2) {

  	$error_message .= 'The Comments you entered do not appear to be valid.<br />';

  }

  $string_exp = "^[0-9 .-]+$";

  if(!eregi($string_exp,$telephone)) {

  	$error_message .= 'The Telphone Number you entered does not appear to be valid.<br />';

  }

  if(strlen($error_message) > 0) {

  	died($error_message);

  }

	$email_message = "Form details below.\n\n";

	

	function clean_string($string) {

	  $bad = array("content-type","bcc:","to:","cc:","href");

	  return str_replace($bad,"",$string);

	}

	

	$email_message .= "Name: ".clean_string($name)."\n";

	$email_message .= "Email: ".clean_string($email_from)."\n";

	$email_message .= "Telephone: ".clean_string($telephone)."\n";

	$email_message .= "Comments: ".clean_string($comments)."\n";

	

	

// create email headers

$headers = 'From: '.$email_from."\r\n".

'Reply-To: '.$email_from."\r\n" .

'X-Mailer: PHP/' . phpversion();

@mail($email_to, $email_subject, $email_message, $headers);  

?>

<!-- Form submission success -->


<table cellpadding="0" cellspacing="0" border="0" width="100%">

        <tr> 

          <td valign="top" height="10"> 

            <p><font face="arial,verdana" size="3" class="page_title"><b><img src="headers/quote.gif" width="410" height="17" alt=""></b></font> 

            <table cellpadding="0" cellspacing="0" border="0" width="100%">

              <tr> 

                <td valign="top"> 

                  <hr noshade size="1">

                  <font face="Verdana, Arial, Helvetica, sans-serif" size="1">Thanks 

                  for visiting our website! We would love to hear from you. </font> 

                 

                  

                </td>

                

              </tr>

            </table>


<?

}

?>

[Alexander]

I assume this would be simple to do in Javascript.

    function dialogue($error = false) { 
        if($error !== false) {
            // error message code  
            $message = "We are very sorry, but there were error(s) found with the form you have submitted.\n\n"; 
            $message .= "These errors appear below.\n\n"; 
            $message .= $error."\n\n"; 
            $message .= "Please go back and fix these errors.\n\n"; 
        } else {
            $message = "Success\n";
        }
        echo "<script type='text/javascript'>alert('" . addcslashes($message, "'") . "');</script>";
    }  

addcslashes will escape ' but not \ for integrity of the Javascript string.

[xynapse]

Thank you for your help. I had searched around and found similar suggestions and I have a feeling it's pretty simple to do but I'm still a little confused as I'm not that proficient in Javascript. Would I declare that function in index.html and then call it somehow in the form?

Another thing I don't like about my form is that once submitted it navigates straight to the contact.php. I'd rather have it to where it just processes the contact.php yet stays on the form page with the dialog box showing the success or errors. Maybe a php redirect would suffice but I imagine there's something smoother that doesn't take much load time.