Remote validation for multiple fields with jQuery validation - php

Question

I'm using the jQuery validation plugin to check if the user excists in my SQL database. I want to check the credentials in checkCredentials.php. My script does check if an email or password is filled in but it does not check if the credentials do exist in my database. Anybody who can tell me what I'm doing wrong? Thanks in advance.
This is my form:
<form action="php/login.php" method="post" id="loginForm" class="form-horizontal">
<div class="form-group">
<input type="email" class="form-control form-control-lg" id="email" name="email" placeholder="Email" />
</div>
<div class="form-group">
<input type="password" class="form-control form-control-lg" id="password" name="password" placeholder="Wachtwoord" />
</div>
<button class="btn btn-block" type="submit" name="login" value="Login">Login</button>
</form>
And this is my script:
$( "#loginForm" ).validate( {
rules: {
email: {
required: true,
email: true
},
password: {
required: true,
remote: {
url: "php/checkCredentials.php",
type: "post",
data: {
email: function () {
return $("#email").val();
}
}
}
},
},
messages: {
email: {
required: "Vul alsjeblieft een e-mail adres in"
},
password: {
required: "Vul alsjeblieft een wachtwoord in",
remote: "E-mail of wachtwoord onjuist"
},
},
And here is my PHP file checkCredentials.php
<?php
require 'database-connection.php';
$email = mysqli_real_escape_string($_REQUEST['email']);
$password = mysqli_real_escape_string($_REQUEST['password']);
$query = "SELECT user_email, user_password FROM table_users WHERE user_email = '$email' AND user_password = '$password'";
$result = mysqli_query($db, $query);
if (mysqli_num_rows($result) == 0)
{
echo 'true';
}
else
{
echo 'false';
}
?>

Answer 1

I changed my code to this and it's working now:
Form:
<form action="php/login.php" method="post" id="loginForm" class="form-horizontal">
<div class="form-group">
<input type="email" class="form-control form-control-lg" id="email" name="email" placeholder="Email" />
</div>
<div class="form-group">
<input type="password" class="form-control form-control-lg" id="password" name="password" placeholder="Wachtwoord" />
</div>
<button class="btn btn-block" type="submit" name="login" value="Login">Login</button>
</form>
Script:
$( "#loginForm" ).validate( {
rules: {
email: {
required: true,
email: true
},
password: {
required: true,
remote: {
url: "php/checkCredentials.php",
type: "post",
data: {
email: function () {
return $("#email").val();
}
}
}
},
},
messages: {
email: {
required: "Vul alsjeblieft een e-mail adres in"
},
password: {
required: "Vul alsjeblieft een wachtwoord in",
remote: "E-mail of wachtwoord onjuist"
},
},
errorElement: "em",
errorPlacement: function ( error, element ) {
error.addClass( "help-block" );
element.parents( ".col-sm-5" ).addClass( "has-feedback" );
if ( element.prop( "type" ) === "checkbox" ) {
error.insertAfter( element.parent( "label" ) );
} else {
error.insertAfter( element );
}
if ( !element.next( "span" )[ 0 ] ) {
$( "<span class='glyphicon glyphicon-remove form-control-feedback'></span>" ).insertAfter( element );
}
},
success: function ( label, element ) {
if ( !$( element ).next( "span" )[ 0 ] ) {
$( "<span class='glyphicon glyphicon-ok form-control-feedback'></span>" ).insertAfter( $( element ) );
}
},
highlight: function ( element, errorClass, validClass ) {
$( element ).parents( ".col-sm-5" ).addClass( "has-error" ).removeClass( "has-success" );
$( element ).next( "span" ).addClass( "glyphicon-remove" ).removeClass( "glyphicon-ok" );
},
unhighlight: function ( element, errorClass, validClass ) {
$( element ).parents( ".col-sm-5" ).addClass( "has-success" ).removeClass( "has-error" );
$( element ).next( "span" ).addClass( "glyphicon-ok" ).removeClass( "glyphicon-remove" );
}
} );
</script>
checkCredentials.php:
<?php
require 'database-connection.php';
$email = mysqli_real_escape_string($db, $_POST['email']);
$password = mysqli_real_escape_string($db, $_POST['password']);
$query = "SELECT user_email, user_password FROM table_users WHERE user_email = '$email' AND user_password = '$password'";
$result = mysqli_query($db, $query);
if (mysqli_num_rows($result) > 0)
{
echo 'true';
}
else
{
echo 'false';
}
?>