Forum : Simple formulaire login Ajax

Bonjour,

Voila je rencontre un petit problème avec mon code.

Décrivez ici votre code ou ce que vous cherchez à faire

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="author" content="THIRIONET Thierry" /> <meta name="description" content="social network, réseau social, teachers, Teachers du net, TDN, tdn"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>Responsive registration form</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous"> <style type="text/css"> .alert-class,.register-class,.forgot-class{ display: none; } </style> </head> <body class="bg-dark"> <div class="container mt-4"> <div class="row"> <div class="col-lg-4 offset-lg-4 alert-class" id="alert"> <div class="alert alert-success"> <strong id="result"></strong> </div> </div> </div>  <div class="row"> <div class="col-lg-4 offset-lg-4 bg-light rounded" id="login-box"> <h2 class="text-center mt-2">Login</h2> <form method="post" role="form" class="p-2" id="login-form"> <div class="form-group"> <input type="input" name="username" id="username" placeholder="Entrez votre nom utilisateur" class="form-control" minlength="3" required> </div> <div class="form-group"> <input type="password" name="password" id="password" placeholder="Entrez votre mot de passe" class="form-control" minlength="6" required> </div> <div class="form-group"> <input type="submit" name="login-btn" id="login-btn" value="Connexion" class="btn btn-primary btn-block"> </div> </form> </div> </div> <script src="http://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.min.js"></script> <script> $(document).ready(function(){ $("#login-lnk").click(function(){ $("#register-box").hide(); $("#login-box").show(); }); $("#login-form").validate(); $("#login-btn").click(function(e){ if (document.getElementById('login-form').checkValidity()){ e.preventDefault(); $.ajax({ type: "post", url: "register.php", data:$("#login-form").serialize()+'&action=login', success:function(response){ window.alert("login function"); $("#alert").show(); $("#result").html(response); } }); } return true; }); }); </script> </div> </body> </html>

Ce que je veux

Je fais simple un "print_r($_POST);" dans la page que le click sur le bouton "login-btn" est censé appeler.

Ce que j'obtiens

Apparemment, il n'appelle pas la page "register.php".

Simple formulaire login Ajax

Ce que je veux

Ce que j'obtiens

5 réponses