Problem receiving _POST vars from ajax

Greetings,

I’m sending a form with ajax but my .php processor doesn’t seem to be receiving the data string from ajax because when the email arrives, none of the POST data appears.

Can anyone spot why, please?

ajax.js:

$.ajax({
			type: "POST",
			url: "bin/process.php",
			data: dataString,
			success: function() {
				$('#contact_form').html("<div id='message'></div>");
				$('#message').html("<h2>Contact Form Submitted!</h2>")
				.append("<p>We will be in touch soon.</p>")
				.hide()
				.fadeIn(1500, function() {
					$('#message').append("<img id='checkmark' src='images/check.png' />");
				});
			}
		}); 

processor.php

<?php
//if ((isset($_POST['name'])) && (strlen(trim($_POST['name'])) > 0)) {
	$name = stripslashes(strip_tags($_POST['name']));
//} else {$name = 'No name entered';}
//if ((isset($_POST['email'])) && (strlen(trim($_POST['email'])) > 0)) {
	$email = stripslashes(strip_tags($_POST['email']));
//} else {$email = 'No email entered';}
//if ((isset($_POST['phone'])) && (strlen(trim($_POST['phone'])) > 0)) {
	$phone = stripslashes(strip_tags($_POST['phone']));
//} else {$phone = 'No phone entered';}

ob_start();
?>
<html>
<head>
<style type="text/css">
...

Thank you.

ahundiak, thank you.

Here is process.php in its entirety:

<?php
//if ((isset($_POST['name'])) && (strlen(trim($_POST['name'])) > 0)) {
$name = $_POST['name'];
//} else {$name = 'No name entered';}
//if ((isset($_POST['email'])) && (strlen(trim($_POST['email'])) > 0)) {
$email = $_POST['email'];
//} else {$email = 'No email entered';}
//if ((isset($_POST['phone'])) && (strlen(trim($_POST['phone'])) > 0)) {
$phone = $_POST['phone'];
//} else {$phone = 'No phone entered';}

ob_start();
?>
<html>
<head>
<style type="text/css">
</style>
</head>
<body>
<table width="500" border="1" cellspacing="2" cellpadding="2">
<tr bgcolor="#eeffee">
<td>Name</td>
<td><?php $name; ?></td>
</tr>
<tr bgcolor="#eeeeff">
<td>Email</td>
<td><?php $email; ?></td>
</tr>
<tr bgcolor="#eeffee">
<td>Phone</td>
<td><?php $phone; ?></td>
</tr>
</table>
</body>
</html>
<?php
$body = ob_get_contents();

	$to	      = 'Admin <admin@blat.com>';
	$headers  = 'MIME-Version: 1.0' . "\\r\
";
	$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\\r\
";
	$headers .= 'From: Admin <admin@blat.com>' . "\\r\
";
	$headers .= 'Reply-To: House <house@blat.com>' . "\\r\
";
	$headers .= 'X-Mailer: PHP/ '. phpversion();

mail($to, "Online order", $body, $headers);

ob_end_flush(); ?>

And here is ‘response’ from Firebug console:

<html>
<head>
<style type="text/css">
</style>
</head>
<body>
<table width="500" border="1" cellspacing="2" cellpadding="2">
<tr bgcolor="#eeffee">
<td>Name</td>
<td></td>
</tr>
<tr bgcolor="#eeeeff">
<td>Email</td>
<td></td>
</tr>
<tr bgcolor="#eeffee">
<td>Phone</td>
<td></td>
</tr>
</table>
</body>
</html>

Change
<td><?php $name; ?></td>
To
<td><?php echo $name; ?></td>

Great. That cuts the problem in half.

You didn’t post your complete process.php file but i’m wondering if at the end you do something like:
<?php ob_end_flush(); ?>

If not then read up in the manual on what ob_start() does.

If you are sending the buffer then post a bit more of your process code so we can see where $name is being echoed. And maybe copy/paste/post the actual response from firebug.

Thank you.

I have done that and Firebug reports that the data is inside the POST parameters but the response doesn’t contain any of it.

I have an update. Progress, but not there yet…

I removed all whitespace (just source formatting) from the beginning of the dataString and alert lines in the .js file and can now generate an alert WITH the data intact, so it’s going astray somewhere between the ajax file and the php processor.

Okay,

I tried all the steps you suggested, all the way through to checking that I could get any kind of alert. I can’t! Not even alert(‘here’);

Immediately prior to the dataString line I have my input validation for all three fields. The only variation in how each field is handled is that the email address is also compared with a regexp. Here’s what they look like:

ajax.js

$('form#contact').submit(function() {
									  
		$('.error').hide();
			
		var name = $("input#name").val();
		if (name == "") {
			$("label#name_error").show();
			$("input#name").focus();
			return false;
		}

Apart from some CSS setup at the top of the .js file, that’s essentially everything that’s in it.

I’m baffled!

Consider installing firebug and using the Firefox browser for development. Firebug lets you monitor traffic between the browser and the server so you can quickly and easily see what is being sent (or perhaps not sent). Firebug also allows stepping through your javascript and examine variables.

You need some sort of tool like this for doing almost any sort of ajax work.

Need more than that to figure it out. The assignment there looks fine. So now that you know dataString doesn’t exist test the other variables dataString is made up of.

alert('Name: ’ + name + 'Email: ’ + email + 'Phone: ’ + phone);

What do you get with that in place of the alert(dataString);

If nothing happens with that than lastly check to see if your even getting the point you think you are with a basic alert:

alert(‘here’);

post the results of those tests.

Thank you for your reply.

Very odd; no alert pops up - indicates no data?

Strangely, the form validation is working fine. If I leave a field empty my error messages work as expected.

Have I formatted the data string correctly?:

var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone;

Are you sure data exists inside the js dataString variable?

Right before the ajax call place alert(dataString) to confirm data actually exists. That is the first thing you need to be sure of.

mortified

Thank you very much!