Well I try to make a sign-up form. But I want to check all the inputs with PHP. (Like this exemple : Example Consequently, I make a controller who send (JSON format) to PHP. However, if PHP encountered an error I wanted that this error will be displayed with AngularJS.
However, I encounter this error :
TypeError: Cannot read property 'firstnameErre' of undefined
I've spend 5 hours with this problem consequently if somebody know why this doesn't work that shall help me a lot !
First I don't understand why console.log(jam); display nothing in the console.
Then : angular.min.js:108 TypeError: Cannot read property 'firstnameErre' of undefined
Index.html :
<form ng-controller="SignInCtrl" name="doSignUp"><br>
<div id="name-group" class="form-group" ng-class="{ 'has-error' : lastnameErr }">
<input type="text" ng-model="formData.LastName" placeholder="Nom" class="form-control" required/> <br>
<span class="help-block" ng-show="lastnameErr">{{ lastnameErr }}</span>
</div>
<div id="name-group" class="form-group" ng-class="{ 'has-error' : firstnameErr }">
<input type="text" ng-model="formData.FirstName" placeholder="Prénom" class="form-control" required/> <br>
<span class="help-block" ng-show="firstnameErr">{{ firstnameErr }}</span>
</div>
<div id="name-group" class="form-group" ng-class="{ 'has-error' : emailErr }">
<input type="email" ng-model="formData.Email" placeholder="Email" class="form-control" required/> <br>
<span class="help-block" ng-show="emailErr">{{ emailErr }} </span>
</div>
<div id="name-group" class="form-group" ng-class="{ 'has-error' : motmotErr }">
<input type="password" ng-model="formData.Motmot" placeholder="Mot de passe (6 caractères minimum)" class="form-control" required/> <br>
<span class="help-block" ng-show="motmotErr">{{ motmotErr }}</span>
</div>
<div id="naissance" required>
<label> Date de naissance :</label>
<div class="row">
<div class="col-lg-4">
Jour: <select class="form-control" ng-model="SelectedDay"
ng-options="label for label in Days | limitTo:NumberOfDays"></select>
</div>
<div class="col-lg-4">
Mois: <select class="form-control" ng-model="SelectedMonth"
ng-options="label for label in Months"
ng-change="UpdateNumberOfDays()"></select>
</div>
<div class="col-lg-4">
Années : <select class="form-control" ng-model="SelectedYear"
ng-options="label for label in Years"
ng-change="UpdateNumberOfDays()"></select>
</div>
<br/>
</div>
</div>
<br>
<p>En cliquant sur M'inscrire, vous acceptez <a href="#mentionslegales" data-toggle="modal" data-target="#mentionslegales">les Conditions Générales d'utilisation ainsi que la
Charte de Confidentialité d'Alumni</a></p>
<input type="button" value="M'inscrire" name="signUpi" class="btn btn-success btn-sm" ng-click="signIn()"/>
</form>
app.js :
.controller('SignInCtrl', function($scope, $http) {
$scope.formData = {};
/*$http.post("../../api.php?action=doSignIn",
{
'FirstName': $scope.FirstName,
'LastName': $scope.LastName,
'Email': $scope.Email,
'Motmot': $scope.Motmot,
'SelectedDay': $scope.SelectedDay,
'SelectedMonth': $scope.SelectedMonth,
'SelectedYear': $scope.SelectedYear
})*/
$scope.signIn = function () {
$http({
method : 'POST',
url : '../../../api.php',
data : $.param($scope.formData), // pass in data as strings
headers : { 'Content-Type': 'application/x-www-form-urlencoded' } // set the headers so angular passing info as form data (not request payload)
})
.success(function(data) {
console.log(data);
if (!data.success) {
console.log("Are you okay ?");
// if not successful, bind errors to error variables
$scope.firstnameErr = data.errors.firstnameErr;
console.log($scope.firstnameErr);
$scope.lastnameErr = data.errors.lastnameErr;
$scope.emailErr = data.errors.emailErr;
$scope.motmotErr = data.errors.motmotErr;
} else {
// if successful, bind success message to message
$scope.message = data.msg;
console.log($scope.message);
}
})
}
});
api.php :
/*******************************************************************************************************************************************
doSignIn(): Function to add user to db
*******************************************************************************************************************************************/
function doSignIn()
{
/****** Database Details *********/
$db_name = '';
$hostname = '';
$username = '';
$password = '';
// Connexion to the database
try {
$conn = new PDO("mysql:host=$hostname;dbname=$db_name", $username, $password);
// Set the PDO error mode to exception
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
/*Decode JSON to PHP variables
$data = json_decode(file_get_contents("php://input"));
$FirstName = $data->FirstName;
$LastName = $data->LastName;
$Email = $data->Email;
$Motmot = $data->Motmot;*/
$errors = array(); // array to hold validation errors
$data = array(); // array to pass back data
//Verifications of PHP variables
if (empty($FirstName)) {
$errors['firstnameErr'] = 'Votre prénom est requis.';
}
if (empty($LastName)){
$errors['lastnameErr'] = 'Votre nom de famille est requis.';
}
if (empty($Email)){
$errors['emailErr'] = 'Votre email est requis.';
}
if (empty($Motmot)){
$errors['motmotErr'] = 'Votre mot de passe est requis.';
}
// Verification of password
if (preg_match("#^[a-zA-Z0-9]{6,40}$#", $Motmot)) {
} else {
$errors['message'] = "Le mot de passe n/'est pas bon (6 caractères minimum, uniquement lettres et chiffres)";
}
//Verification that email is not already used
$query = $conn->prepare("SELECT Email FROM users WHERE Email = ?");
$query->bindValue(1, $Email);
$query->execute();
if ($query->rowCount() > 0) {
$errors['email2Err'] = 'Email déja utilisé';
}
//Errors
if (!empty($errors)) {
// if there are items in our errors array, return those errors
$data['success'] = false;
$data['errors'] = $errors;
} else {
//Hash password
$PassHache = sha1($Motmot);
$SelectedDay = $data->SelectedDay;
$SelectedMonth = $data->SelectedMonth;
$SelectedYear = $data->SelectedYear;
$Birthday = $SelectedYear . '-' . $SelectedMonth . '-' . $SelectedDay;
$Hash = md5(rand(0, 1000));
$sql = "INSERT INTO users (FirstName, LastName, Email, Pass, Birthday, SignInDate, Hash, Activate) VALUES('$FirstName','$LastName', '$Email','$PassHache', '$Birthday', now(), '$Hash', 0)";
// use exec() because no results are returned
$conn->exec($sql);
// if there are no errors, return a message
$data['success'] = true;
$data['msg'] = 'Success!';
//Send email confirmation
$to = $Email; // Send email to our user
$subject = 'Alumni, vérification de votre inscription'; // Give the email a subject
$message = '
Merci pour vous êtes inscrit!
Voici vos informations.
------------------------
Email: ' . $Email . '
Mot de passe: ' . $Motmot . '
------------------------
Veuillez cliquer sur ce lien pour activer votre compte:
http://www.alumni-parcours.com/verify.php?email=' . $Email . '&hash=' . $Hash . '
'; // Our message above including the link
$headers = 'From:noreply@alumni-parcours.com' . "
"; // Set from headers
mail($to, $subject, $message, $headers); // Send our email
}
echo json_encode($data);
}
catch (PDOException $e) {
echo $sql . "<br>" . $e->getMessage();
}
$conn = null;
}
?>
Thanks ! Have a good day !