Hi im a web design student and i need to do a simple mail form for a firm and i need 2 make it 2 work, now ive made this , but the thing is if i enter all fields and skip the SECTOR menu the submit executes, if i select from SECTOR the mail input removes and i fill the rest of the inputs the submit doesnt execute, i need to make the form to work on both ways coz mail input is for sending away mails and sector is for internal, so can some1 check where and what im missing in the code and also test it if it sends mail....tnx im using parsley.js for verification...
the form.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Contact us</title>
<link rel="stylesheet" text="text/css" href="style.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="parsley.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#sendTo').change(function(){
var selected_item = $(this).val()
if(selected_item == "a"){ // 'Other'
$('#other').val('').show(); //show paragraf if Other is selected
}else{
$('#other').hide(); //Hide paragraf if anything else is selected
}
});
});
</script>
</head>
<body>
<h1>Contact us</h1>
<form method="post" name="contactform" action="send.php" data-validate="parsley">
<p>
<label for='name'>Your Name:</label>
<input type="text" name="name" id="name" data-required="true">
</p>
<p>
<label for='subject'>Subject:</label>
<input type="text" name="subject" id="subject" data-required="true">
</p>
<p id="other">
<label for='yourEmail'>Email Address:</label>
<input type="text" name="yourEmail" id="yourEmail" data-trigger="change" data-type="email" data-required="true">
</p>
<p>
<label for='sendTo'>Sector:</label>
<select id="sendTo" name="sendTo" id="sendTo">
<option id="empty" selected="selected" value="a">-</option>
<option id="The Fund Manager" value="neogeomk@yahoo.com">The Fund Manager</option>
<option id="Sales Team" value="neogeomk@yahoo.com">Sales Team</option>
<option id="Investment Advisor" value="neogeomk@yahoo.com">Investment Advisor</option>
<option id="Customer Service" value="neogeomk@yahoo.com">Customer Service</option>
<option id="General Inquiries" value="neogeomk@yahoo.com">General Inquiries</option>
</select>
</p>
<p>
<label for='message'>Message:</label>
<textarea name="message" id="message" data-required="true"></textarea>
</p>
<input type="submit" value="Submit" class="kopce">
</form>
</body>
</html>
send.php
<?php
// This is where we will recieve the information the user posted by extracting it from the POST array.
$to = 'neogeomk@yahoo.com';
$name = $_POST['name'];
$yourEmail = $_POST['yourEmail'];
$sendTo = $_POST['sendTo'];
$subject = $_POST['subject'];
$message = $_POST['message'];
// This simply puts todays date in the following format: "Thursday, June 11, 2009, 6:51 pm"
$todayis = date("l, F j, Y, g:i a") ;
// This switch statement will dictate which email address we will send to and assign it to the $sendTo variable
switch ($sendTo)
{
case "empty":
$sendTo = $_POST['yourEmail'];
break;
case "The Fund Manager":
$sendTo = "neogeomk@yahoo.com";
break;
case "Sales Team":
$sendTo = "neogeomk@yahoo.com";
break;
case "Investment Advisor":
$sendTo = "neogeomk@yahoo.com";
break;
case "Customer Service":
$sendTo = "neogeomk@yahoo.com";
break;
case "General Inquiries":
$sendTo = "neogeomk@yahoo.com";
break;
}
// This sets up the required fields for us to put in the mail function
$subject = "Subject: $subject";
$message = " Message: $message \r \n From: $name \r \n Reply to: $yourEmail";
// Always set content-type when sending HTML email
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";
if(mail($to, $sendTo, $subject, $message, $headers)) {
echo("<p>Email succesfully sent to</p>$sendTo on $todayis");
} else {
echo("<p>Message delivery failed...</p>");
}
?>
style.css
@CHARSET "UTF-8";
@font-face {
font-family: "Economica";
font-style: normal;
font-weight: 700;
src: local("Economica Bold"), local("Economica-Bold"), url("http://themes.googleusercontent.com/static/fonts/economica/v1/UK4l2VEpwjv3gdcwbwXE9HhCUOGz7vYGh680lGh-uXM.woff") format("woff");
}
h1
{
font-family : "Economica";;
font-size : 30px;
font-weight : bold;
}
label,a
{
font-family : "Economica";
font-size : 16px;
}
label {
display: block;
margin-bottom: 5px;
}
p {
margin: 0;
}
ul {
list-style: none;
padding: 0;
margin: 0;
}
ul li {
line-height: 0px;
margin-bottom: 10px;
font-family: "Economica";
font-size: 14px;
padding-left: 33px;
color: #FF0000;
}
#sendTo {
height: 30px;
background-color: #ffffff;
border: 1px solid #cccccc;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.hidden {
display: none;
}
.kopce {
color: #444444;
background: #F3F3F3;
border: 1px #DADADA solid;
padding: 5px 10px;
border-radius: 2px;
font-weight: bold;
font-size: 9pt;
width: 100px;
}
.kopce:hover {
border: 1px #C6C6C6 solid;
box-shadow: 1px 1px 1px #EAEAEA;
color: #333333;
background: #F7F7F7;
}
.kopce:active {
box-shadow: inset 1px 1px 1px #DFDFDF;
}
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
display: inline-block;
height: 20px;
padding: 4px 6px;
margin-bottom: 10px;
font-size: 16px;
line-height: 20px;
color: #555555;
vertical-align: middle;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
font-family: "Economica";
}
input,
textarea,
.uneditable-input {
width: 206px;
}
textarea {
height: auto;
}
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
background-color: #ffffff;
border: 1px solid #cccccc;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
-moz-transition: border linear 0.2s, box-shadow linear 0.2s;
-o-transition: border linear 0.2s, box-shadow linear 0.2s;
transition: border linear 0.2s, box-shadow linear 0.2s;
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
border-color: rgba(82, 168, 236, 0.8);
outline: 0;
outline: thin dotted \9;
/* IE6-9 */
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
}
input.parsley-error, textarea.parsley-error {
background-color: #F2DEDE !important;
border: 1px solid #EED3D7 !important;
color: #B94A48 !important;
}
input.parsley-success, textarea.parsley-success {
background-color: #DFF0D8 !important;
border: 1px solid #D6E9C6 !important;
color: #468847 !important;
}
Attached Files
-
![Attached File]()
contact form.zip 14.75K
0 downloads
