Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

AJAX Registration Form, JSON responce

Featured Replies

Hey, I've got a registration form which is being submitted via AJAX, the form is processed and a JSON response is returned. The problem I've got is that the if statement within processRegistration.php always returns with "fields have not been entered" even when the fields are fully entered.

 

This is the javascript code for the form submission:

	$.ajax({
  type: "POST",
  url: "includes/registerProcess.php",
  data: $("registerForm").serialize(),
  dataType: "json",

  success: function(msg) {
	$("#result").html(msg.message);
  },
  error: function(){
      $("#result").html("There was an error submitting the form. Please try again.");
   }

});
// make sure the form doesnt post
return false;
});

 

And here is the registration validation:

 

<?php

/**
*
* RegisterProcess.php insert registration into database
*/
session_start();
require_once('pdoDB.class.php');

$forename = $_POST['forename'];
$surname = $_POST['surname'];
$email = $_POST['email'];
$house = $_POST['house'];
$street = $_POST['street'];
$postcode = $_POST['postcode'];
$password = $_POST['password'];

// check to see if values are set
if (!empty($forename) && !empty($surname) && !empty($email) && !empty($house) && !empty($street) && !empty($postcode) && !empty($password)) {

//response array with status code and message
$response_array = array();

// escape all html characters
$forename = trim(htmlspecialchars($forename));
$surname = trim(htmlspecialchars($surname));
$email = trim(htmlspecialchars($email));
$house = trim(htmlspecialchars($house));
$street = trim(htmlspecialchars($street));
$postcode = trim(htmlspecialchars($postcode));
$password = trim(htmlspecialchars($password));

if (!preg_match("/^[A-Z]{1,2}[0-9]{2,3}[A-Z]{2}$/",$postcode) || !preg_match("/^[A-Z]{1,2}[0-9]{1}[A-Z]{1}[0-9]{1}[A-Z]{2}$/", $postcode) || !preg_match("/^GIR0[A-Z]{2}$/", $postcode)) {
	//die('{status:0,txt:"You haven\'t provided a correct postcode"}');
	$response_array['message'] = "You entered an incorrect postcode";
} elseif (!preg_match("/^[A-Z0-9._%-]+@[A-Z0-9][A-Z0-9.-]{0,61}[A-Z0-9]\.[A-Z]{2,6}$/i", $email)) {
	//die('{status:0,txt:"You haven\'t provided a valid email"}');
	$response_array['message'] = "You entered an incorrect email";
} else {
	// create a salt
	function createSalt() {
		$string = md5(uniqid(rand(),true));
		return substr($string, 0, 3);
	}

	// hash password before inserting it into database
	//convert password to hashkey
	$hash = hash('sha256', $password);
	$salt = createSalt();
	// has password again with salt added on the end
	$hash = hash('sha256', $salt . $hash);
	// get connection
	$db = pdoDB::getConnection();

	$query = $db->prepare("INSERT INTO users (forename, surname, email, houseNum, street, postcode, password, salt)
	  VALUES (:forename, :surname, :email, :houseNum, :street, :postcode, :password, :salt)");
	$query->execute(array(':forename' => $forename, ':surname' => $surname, 'email' => $email, ':houseNum' => $house, ':street' => $street, ':postcode' => $postcode, ':password' => $hash, ':salt' => $salt));
	//echo '{status:1,txt:"You have successfully registered, you can now login!"}';
	$response_array['message'] = "You've successfully registered! You can now login.";
}
} else {
// not all information is set return false
//die('{status:0,txt:"You haven\'t filled in each field"}');
$response_array['message'] = "You haven't filled in all the fields!";
}

//send the response back
echo json_encode($response_array);

?>

Try doing it without the json and in your php just echo out the response:

 

$.ajax({
         type: "POST",
         url: "includes/registerProcess.php",
         data: $("registerForm").serialize(),

         success: function(msg) {
               $("#result").html(msg.message);
         },
         error: function(){
             $("#result").html("There was an error submitting the form. Please try again.");
   }

echo "You've successfully registered! You can now login.";
       }
} else {
       // not all information is set return false
       //die('{status:0,txt:"You haven\'t filled in each field"}');
       echo "You haven't filled in all the fields!";
}

If that doesn't help then you need to manually check the posted data to ensure it is all there (i.e. submit the form to the php page directly and dump the posted data without using ajax).

  • Author

Try doing it without the json and in your php just echo out the response:

 

$.ajax({
         type: "POST",
         url: "includes/registerProcess.php",
         data: $("registerForm").serialize(),

         success: function(msg) {
               $("#result").html(msg.message);
         },
         error: function(){
             $("#result").html("There was an error submitting the form. Please try again.");
   }

echo "You've successfully registered! You can now login.";
       }
} else {
       // not all information is set return false
       //die('{status:0,txt:"You haven\'t filled in each field"}');
       echo "You haven't filled in all the fields!";
}

If that doesn't help then you need to manually check the posted data to ensure it is all there (i.e. submit the form to the php page directly and dump the posted data without using ajax).

 

If I take out the JSON and simply echo out the errors instead then the form will not post?

  • Author

Now I'm always getting an incorrect postcode returned?

 

if ((!preg_match("/^[A-Z]{1,2}[0-9]{2,3}[A-Z]{2}$/",$postcode)) || (!preg_match("/^[A-Z]{1,2}[0-9]{1}[A-Z]{1}[0-9]{1}[A-Z]{2}$/", $postcode)) || (!preg_match("/^GIR0[A-Z]{2}$/", $postcode))) {
	//die('{status:0,txt:"You haven\'t provided a correct postcode"}');
	$response_array['message'] = "You entered an incorrect postcode";
	//send the response back
	echo json_encode($response_array);
} elseif (!preg_match("/^[A-Z0-9._%-]+@[A-Z0-9][A-Z0-9.-]{0,61}[A-Z0-9]\.[A-Z]{2,6}$/i", $email)) {
	//die('{status:0,txt:"You haven\'t provided a valid email"}');
	$response_array['message'] = "You entered an incorrect email";
	//send the response back
	echo json_encode($response_array);
} else {
	// create a salt
	function createSalt() {
		$string = md5(uniqid(rand(),true));
		return substr($string, 0, 3);
	}

	// hash password before inserting it into database
	//convert password to hashkey
	$hash = hash('sha256', $password);
	$salt = createSalt();
	// has password again with salt added on the end
	$hash = hash('sha256', $salt . $hash);
	// get connection
	$db = pdoDB::getConnection();

	$query = $db->prepare("INSERT INTO users (forename, surname, email, houseNum, street, postcode, password, salt)
	  VALUES (:forename, :surname, :email, :houseNum, :street, :postcode, :password, :salt)");
	$query->execute(array(':forename' => $forename, ':surname' => $surname, 'email' => $email, ':houseNum' => $house, ':street' => $street, ':postcode' => $postcode, ':password' => $hash, ':salt' => $salt));
	//echo '{status:1,txt:"You have successfully registered, you can now login!"}';
	$response_array['message'] = "You've successfully registered! You can now login.";
	//send the response back
	echo json_encode($response_array);
}

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.