I have a PHP file index.php containing a form with Bootstrap’s needs-validation class, but it seems that the validation isn’t being triggered upon form submission. Here’s my index.php file:
<!DOCTYPE html>
<html lang="de">
<head>
<?php include_once __DIR__ . '/src/php/head.php' ?>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="src/css/login.css">
</head>
<body>
<div class="container">
<div id="box">
<h1>Login</h1>
<form method="POST" action="src/php/login.php" class="row g-4 needs-validation" id="loginForm" novalidate>
<div class="col-sm-12">
<label for="username" class="form-label">Benutzername: *</label>
<input type="text" class="form-control" id="username" name="username" required>
<div class="invalid-feedback">
Benutzername ist erforderlich
</div>
</div>
<div class="col-sm-12">
<label for="password" class="form-label">Passwort: *</label>
<input type="text" class="form-control" name="password" id="password" required>
<div class="invalid-feedback">
Passwort ist erforderlich
</div>
</div>
<button class="btn btn-primary rounded-pill px-3" type="submit">Login</button>
</form>
<div id="register">
<a href="users/create">Registrieren</a>
</div>
</div>
</div>
</body>
<?php include_once 'src/php/footer.php' ?>
<script src="src/js/login.js"> </script>
</html>
Additionally, here’s my head.php file:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href=https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css rel="stylesheet"
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
And footer.php:
<script src=https://code.jquery.com/jquery-3.7.1.min.js
integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<script src=https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js
integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous">
</script>
Despite having the needs-validation class on the form, it doesn’t seem to trigger validation when I submit the form. What could be causing this issue, and how can I fix it?