From 65bc4d0ad68efbb6284831b379b38a3d0fd3b2dd Mon Sep 17 00:00:00 2001
From: mlawday <mlawday@gmail.com>
Date: Tue, 10 Feb 2015 13:03:08 -0700
Subject: [PATCH] Updated index.php

Added JS validation to the form along with Google's reCAPTCHA.
---
 index.php | 103 ++++++++++++++++++++++++++++++++++++++++++------------
 1 file changed, 80 insertions(+), 23 deletions(-)
diff --git a/index.php b/index.php
index 610ba76..a6e6418 100644
--- a/index.php
+++ b/index.php
@@ -12,9 +12,60 @@
 	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
 	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+	<script src='https://www.google.com/recaptcha/api.js'></script>
 	<link rel="icon" type="image/png" href="star.png"/>
+	<script >
+		
+function validateContactForm()
+{
+
+	var error="<strong>There were error(s) in your form:</strong>";
+	var errorMsg=new Array();
+	
+	
+    var name = document.ContactForm.name;
+    var email = document.ContactForm.email;
+    var message = document.ContactForm.message; 
+    var subject = document.ContactForm.subject;
+	
+	 if (name.value == "")
+    {		
+		errorMsg.push("<br />Please enter your name");
+    }
+	var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
 
+	if (email.val == "" || !re.test(email.value))
+	{
+        errorMsg.push("<br />Please enter a valid email.");
+	}
+	if (subject.value == "")
+    {
+        errorMsg.push("<br />Please enter a subject.");
 	
+    }
+	if (message.value == "")
+    {
+		errorMsg.push("<br />Please enter a message.");
+    }
+	
+	var messageHtml="";
+	
+	errorMsg.forEach(function(comment) {
+		messageHtml += comment;
+	}); 
+		if(messageHtml.length > 0){
+		$("#error").show();
+		document.getElementById("error").innerHTML = error + messageHtml;
+		return false;
+		} else {
+			$("#error").hide();
+			$("#success").show();
+			document.getElementById("success").innerHTML = "<strong>Thank you!</strong> I'll be in touch.";
+			return true;
+		}
+	}	
+	</script>
+	 <script src='https://www.google.com/recaptcha/api.js'></script>
 	<style>
 	
 	body { 
@@ -36,60 +87,66 @@
         margin: 15px 0 25px 0;
 		text-align: center;
       }
-	
-	
-      
+	  
+	.g-recaptcha{
+		padding-bottom:10px;
+	}
 	</style>
 	
 	
 </head>
-<body>
-	<?php include 'email.php';?>
+<body>	
+
+	<? $link = mysqli_connect("localhost", "mlawdayc", "T4CRvuQ!D*R", "mlawdayc_contactform");
 	
+		$query = "SELECT * FROM users";?>
+
+	<?php include 'email.php'; ?>
 	<div class="container" style="margin-top:50px">
 			
 				<div class='row whiteBackground'>
 					<h1>Contact Form</h1>
-						<?php echo $result; ?>
-						<form name="contactform" method="post" class="form-horizontal" id="validationForm">
-							<div class="form-group">
+					<?php echo $result; ?>
+						<div id="error" class='alert alert-danger'> </div>
+						<div id="success" class="alert alert-success"></div>
+						<form name="ContactForm" method="post" class="form-horizontal" id="validationForm" onsubmit="return validateContactForm();" >
+							
+							<div class="form-group name">
 								<label for="name" class="col-sm-2 control-label">Name</label>
 								<div class="col-sm-10">
-									<input type="text" name="name" class="form-control" placeholder="Your Name"
-									value="<?php echo $_POST['name']; ?>" />
+									<input type="text" name="name" id="name" class="form-control" placeholder="Your Name"
+									 />
 								</div>
 							</div>
-							<div class="form-group">
+							<div class="form-group email">
 								<label for="email" class="col-sm-2 control-label">Email</label>
 								<div class="col-sm-10">
-									<input type="text" class="form-control" id="email" name="email" placeholder="Your Email" value="<?php echo $_POST['email']; ?>" />
+									<input type="text" class="form-control" name="email" placeholder="Your Email"  />
 								</div>
 							</div>
-							<div class="form-group">
+							<div class="form-group subject">
 								<label for="subject" class="col-sm-2 control-label">Subject</label>
 								<div class="col-sm-10">
-									<input type="text" class="form-control" id="subject" name="subject" placeholder="Subject Message" value="<?php echo $_POST['subject']; ?>" />
+									<input type="text" class="form-control" name="subject" placeholder="Subject Message" />
 								</div>
 							</div>
-							<div class="form-group">
+							<div class="form-group message">
 								<label for="message" class="col-sm-2 control-label">Message</label>
 								<div class="col-sm-10">
-									<textarea class="form-control" id="message" name="message" placeholder="Your message..."><?php echo $_POST['message']; ?></textarea>
+									<textarea class="form-control" name="message" placeholder="Your message..."></textarea>
 								</div>
 							</div>
-							
+							<div class="g-recaptcha col-sm-offset-2" id="recaptcha" name="recaptcha" data-sitekey="6LehmgETAAAAAKSi_P8IFa9f7sqS5XXW0UK7PQDv" ></div>
 							<div class="form-group">
 								<div class="col-sm-offset-2 col-sm-10">
 									<input type="submit" name="submit" class="btn btn-success btn-lg" value="Send Message"/>
 									
 								</div>
 							</div>
-						</form>
-					
-			
+							
+						</form>		
 		</div>
-
-		
-
+<script>$("#error").hide();</script>
+<script>$("#success").hide();</script>
 </body>
 </html>
