php script for emailing variables with ajax
I have already posted on the ajax section on this very board and was advised to ask some php gurus for help.
The main problem I have is that I cannot manage the variables which are set in a contact form are successfully emailed to me. So there must be an error in the php file itself, although it is just a very simple testfile.
The important part of my JS looks like this:
$("#submitQuote").live('click',function(){
var shirt_style = "shirt_style="+$(".dropdown[title=shirt_style] .dropdownValue").text();
var shirt_type = "&shirt_type="+$(".dropdown[title=shirt_type] .dropdownValue").text();
var cuffs = "&cuffs="+$(".dropdown[title=cuffs] .dropdownValue").text();
var chestpoket = "&chestpoket="+$(".dropdown[title=chestpoket] .dropdownValue").text();
var collar = "&collar="+$(".dropdown[title=collar] .dropdownValue").text();
var collar_buttons = "&collar_buttons="+$(".dropdown[title=collar_buttons] .dropdownValue").text();
var fastening = "&fastening="+$(".dropdown[title=fastening] .dropdownValue").text();
var cut = "&cut="+escape($(".dropdown[title=cut] .dropdownValue").text());
var Name = "&Name="+escape($("input[name=Name]").val());
var Email = "&Email="+escape($("input[name=Email]").val());
var Phonenumber = "&Phonenumber="+escape($("input[name=Phonenumber]").val());
var Address = "&Address="+escape($("input[name=Address]").val());
var Zipcode = "&Zipcode="+escape($("input[name=Zipcode]").val());
var City_country = "&City_country="+escape($("input[name=City_country]").val());
var Copy = "&Copy="+$(".checkbox[title=Copy]").hasClass("checkboxChecked");
var form_values1 = shirt_style+shirt_type+cuffs+chestpoket+collar+collar_buttons+fastening+cut;
var form_values2 = form_values1+Name+Email+Phonenumber+Address+Zipcode+City_country+Copy;
$.ajax({
type: "POST",
url: "http://www. .com/ajax/quote.php",
data: form_values2,
success: function() {
$('html,body').animate({scrollTop:290},1000);
$("#quoteStepContainer").html('');
$("#quoteStepContainer").html('<img src="http://www. ...com/img/sent.jpg" width="625" height="160" alt="Thanks" id="thanksImage" />');
$("#thanksImage").fadeIn(1000);
$("#quoteStepContainer").delay(1000).animate({"height": "190px"},1500);
}
});
return false;
});
the importnatn part of the html looks like this:
<form name="quoteForm" method="post" action="#">
<div id="quoteStep1" class="quoteStep">
<label>Shirt style</label>
<div class="dropdown" title="shirt_style"></div>
<label>Shirt type</label>
<div class="dropdown" title="shirt_type"></div>
<label>Collar</label>
<div class="dropdown" title="collar"></div>
<label>Collar Buttons</label>
<div class="dropdown" title="collar_buttons"></div>
<label>Cuffs</label>
<div class="dropdown" title="cuffs"></div>
<label>Chestpoket</label>
<div class="dropdown" title="chestpoket"></div>
<label>Fastening</label>
<div class="dropdown" title="fastening"></div>
<label>Cut</label>
<div class="dropdown" title="cut"></div>
<a href="#" title="To Step 2" class="nextStep"></a>
</div>
<div id="quoteS开发者_如何学JAVAtep2" class="quoteStep">
<p class="stepText">Phew, the last step!</p>
<label>Your name</label>
<input type="text" name="Name" class="required" />
<label>E-mail</label>
<input type="text" name="Email" />
<label>Phone number</label>
<input type="text" name="Phonenumber" />
<label>Address</label>
<input type="text" name="Address" />
<label>Zip-code</label>
<input type="text" name="Zipcode" />
<label>City & Country</label>
<input type="text" name="City_country" />
<label>Want a copy of the form?</label>
<div class="checkbox" title="Copy"></div>
<a href="#" title="To Step 1" class="prevStep"></a>
<a href="#" title="Submit your inquiry" id="submitQuote"></a>
</div>
</form>
the input controls are defined over another js:
jQuery.fn.dropmenu = function (options,width) {
var title = jQuery(this).attr('title');
jQuery(this).css('width',width);
jQuery(this).append('<div class="dropdownValue" title="'+title+'">'+options[0]+'</div>');
jQuery(this).append('<ul class="dropdownList" title="'+title+'">');
for(i=0; i<options.length; i++) {
jQuery(this).parent().find('.dropdownList[title='+title+']').append('<li>'+options[i]+'</li>');
}
jQuery(this).parent().find('.dropdownList').hide();
jQuery(this).parent().find('.dropdownList').css('width',width);
jQuery(this).find('.dropdownList li:first').addClass('first');
jQuery(this).find('.dropdownList li:last').addClass('last');
jQuery('.dropdownValue').toggle(function(){
jQuery(this).parent().find('.dropdownList[title='+title+']').animate({"height": "toggle", "opacity": "toggle"}, 200);
jQuery(this).addClass("dropdownValueClicked");
jQuery('.dropdownList').not('.dropdownList[title='+title+']').hide();
}, function() {
jQuery(this).parent().find('.dropdownList[title='+title+']').animate({"height": "toggle", "opacity": "toggle"}, 200);
jQuery(this).removeClass("dropdownValueClicked");
jQuery('.dropdownList').not('.dropdownList[title='+title+']').hide();
});
jQuery('.dropdownList li').live('mouseenter',function() {
jQuery(this).stop().addClass("hover");
}).live('mouseleave', function() {
jQuery(this).stop().removeClass("hover");
});
jQuery('.dropdownList[title='+title+'] li').live('mousedown',function(){
jQuery('.dropdownValue').removeClass("dropdownValueClicked");
var value = jQuery(this).html();
jQuery(this).parent().animate({"height": "toggle", "opacity": "toggle"}, 200);
jQuery(this).parent().parent().find('.dropdownValue[title='+title+']').html(value);
});
}
and the test php that doesnt work looks like this:
<?php
$mail = $_POST['Email'];
$name = $_POST['Name'];
$to = "email@mydomain.com";
$message =" You received a mail from ".$mail;
$message .=" His name is : ".$name;
if(mail($to,$mail,$message)){
echo "mail successful send";
}
else{
echo "there's some errors to send the mail, verify your server options";
}
?>
Thank you very much for all your time and effort.
Aaron
The content of your form is never proccessed in your php script. You have to wirte the values that where send to your script into thhe $message variable. Example
<?php
$mail = $_POST['Email'];
$name = $_POST['Name'];
$to = "email@mydomain.com";
$message =" You received a mail from ".$mail;
$message .=" His name is : ".$name."\n";
//add content to your mail!!!
$message .= "Shirt style: {$_POST['shirt_style']}";
if(mail($to,$mail,$message)){
echo "mail successful send";
}
else{
echo "there's some errors to send the mail, verify your server options";
}
?>
Im back now and have checked everything. It seems a bit trickier than expected.
Actually it seems that I only receive valid emails, which means emails which include the variables from the form when I use Safari. On browsers like FF and IE I only receive the message without the variables.
So on Safari I get the email:
You received a mail from testmail@test.com His name is : testname Shirt style: Short
on FF and IE I receive, with the same settings the message
You received a mail from His name is : Shirt style:
Additionally I receive the error in IE
Access denied
Row: 127 Sign: 287 Code: 0 URI: http://www. .com/js/jquery.min.js
I do not receive an error message when viewing in FF with firebug.
精彩评论