How to solve this problem: Undefined key array email when want to login on the form?

Question

I am creating a login form send checks to the table using back end in php. I am using correct login to log, but i get this error on line 18 and 19. Undefined array key 'email and password'. I do have these from the table on my database. What could be the problem with this code?

// php code

<?php

session_start();

$dbHost = 'localhost';
$dbName = 'ecommerce_store';
$dbUser = 'root';
$dbPass = '';

try {
  $pdo = new PDO("mysql:host=$dbHost;dbname=$dbName", $dbUser, $dbPass);
  $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch(PDOException $e) {
  echo "Connection failed: " . $e->getMessage();
  exit;
}

$email = $_POST['email'];
$password = $_POST['password'];

$stmt = $pdo->prepare("SELECT * FROM users WHERE email = :email");
$stmt->execute(['email' => $email]);
$user = $stmt->fetch(PDO::FETCH_ASSOC);

if ($user && password_verify($password, $user['password'])) {
  // valid credentials, store user session
  $_SESSION['user'] = $user;
  echo "success";
} else {
  // invalid credentials
  echo "failure";
}

?>

// js code

$(document).ready(function() {
  $('#login-form').validate({
    rules: {
      email: {
        required: true,
        email: true
      },
      password: {
        required: true
      }
    },
    messages: {
      email: {
        required: "Please enter your email address",
        email: "Please enter a valid email address"
      },
      password: {
        required: "Please enter your password"
      }
    },
    submitHandler: function(form) {
      var email = $('#email').val().trim();
      var password = $('#password').val().trim();
      
      $.ajax({
        type: "POST",
        url: "login.php",
        data: {email: email, password: password},
        success: function(response) {
          if (response === "success") {
            window.location.href = "profile.php";
          } else {
            $('#login-messages').html('<div class="alert alert-danger" role="alert">Login failed. Please check your email and password and try again.</div>');
          }
        },
        error: function() {
          $('#login-messages').html('<div class="alert alert-danger" role="alert">Error logging in. Please try again later.</div>');
        }
      });
    }
  });
});

// html code

<!--Form registration-->


<div class="card">
  <div class="card-body">
<form id="login-form" action="login.php" method="POST">
  <div class="form-group text-center">
   <input type="email" class="form-control" id="email" placeholder="Email" name="email" required>
  </div>
  <div class="form-group text-center">
   <input type="password" class="form-control" id="password" placeholder="Password" name="password" required>
  </div>
  <button type="submit" class="btn btn-primary">Login</button>
</form>
</div>
</div>
<div id="login-messages"></div>

</body>
<!----Javascript files validation during form submission ---->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="js/login.js"></script>

Try this on your JQuery code. Instead of declaring email and password variables do this: let myData = {}; myData['email'] = $('#email').val().trim(); myData['password'] = $('#password').val().trim(); And then simply set: data: myData in your ajax section — Sergio, May 04 '23 at 06:28

score -1 · Accepted Answer · edited May 04 '23 at 08:10

-1

try to add isset error bro, to make sure and validate $_POST['email] or $_POST['password] is existed

if (isset($_POST['email']) && isset($_POST['password'])) {
  $email = $_POST['email'];
  $password = $_POST['password'];
  
  // another login process
} else {
  echo "Email and password are required";
  exit;
}

edited May 04 '23 at 08:10

Dharman

30,962
25
85
135

answered May 04 '23 at 04:54

Carvel Saputra

79
3

How to solve this problem: Undefined key array email when want to login on the form?

1 Answers1