Impossible d'obtenir ajax poste au travail

Question

Je suis capable de lancer le fichier js qui fait la première alerte mais je n'arrive pas à obtenir la 2ème alerte, le fichier php est là et fonctionne en retournant 0 mais l'alerte) ne vient pas. Je pense que c'est une syntaxe qui me manque.

$(function() { 
$("#login_form").submit(function() { 
    alert('started js'); 
    //get the username and password 
    var username = $('#username').val(); 
    var password = $('#password').val(); 

    //use ajax to run the check 
    $.post("../php/checklogin.php", { username: username, password: password }, 
     function (result) { 
      alert('finished post'); 
      //if the result is not 1 
      if (result == 0) { 
       //Alert username and password are wrong 
       $('#login').html('Credentials wrong'); 
       alert('got 0'); 
      } 
    }); 
}); 

});

Voici le php

session_start(); 
include 'anonconnect.php'; 

// username and password sent from form 
$myusername= $_POST['username']; 
$mypassword= $_POST['password']; 

$sql = $dbh->prepare("SELECT * FROM Users WHERE UserLogin= :login"); 
$sql->execute(array(':login' => $myusername)); 
$sql = $sql->fetch(); 

$admin = $sql['admin']; 

$password_hash = $sql['UserPass']; 
$salt = $sql['salt']; 

/*** close the database connection ***/ 
$dbh = null; 

if(crypt($mypassword, $salt) == $password_hash){ 
    // Register $myusername, $mypassword and redirect to file 
    $_SESSION['myusername'] = $myusername; 
    $_SESSION['loggedin']; 
    $_SESSION['loggedin'] = 1; 

    if($admin == 1){ 
     $_SESSION['admin'] = 1; 
    } 

    header("location:search.php"); 
} 
else { 
    $_SESSION['loggedin']; 
    $_SESSION['loggedin'] = 0; 
    echo 0; 
} 

Answer 1

Ok, donc je vais essayer de voir si nous pouvons résoudre ce problème. Tout d'abord, nettoyer votre code un peu - code propre est toujours plus facile à déboguer:

$(function() { 
    $("#login_form").on('submit', function(){ 
    console.log('form submitted'); 

    // get the username and password 
    var login_info = { username: $('#username').val(), password: $('#password').val() } 

    // use ajax to run the check 
    $.ajax({ 
     url: '../php/checklogin.php', 
     type: 'POST', 
     data: login_info, 
     success: loginHandler 
     error: function(xhr, status, err){ console.log(xhr, status, err); } 
    }); 

    return false; 

    }); 

    function loginHandler(loggedIn){ 
    if (!loggedIn) { 
     console.log('login incorrect'); 
    } else { 
     console.log('logged in'); 
    } 
    } 

}); 

... ok grand, nous sommes à la recherche un peu mieux maintenant. Passons en revue les changements effectués rapidement.

---

• D'abord, troqué alert s pour console.log s - beaucoup moins ennuyeux. Ouvrez votre console pour vérifier cela - command + optn + J si vous utilisez Chrome. Deuxièmement, nous avons un peu compressé les informations de connexion - ceci est juste esthétique et rend notre code un peu plus propre. Vraiment vous devriez utiliser des variables quand elles doivent être réutilisées, et dans ce cas vous ne les utilisez qu'une fois. Nous avons ensuite échangé la fonction $.post pour $.ajax. Cela nous donne deux choses - l'un est un contrôle un peu plus fin sur les détails de la demande, et le second est un rappel d'erreur, qui est dans ce cas particulièrement important car vous obtenez certainement une erreur de serveur qui est votre problème original. Here are the docs for $.ajax pour toute clarification supplémentaire.

• Nous pointons également le gestionnaire de succès vers une fonction pour minimiser l'imbrication ici. Vous pouvez voir la fonction déclarée ci-dessous, et elle recevra les données renvoyées par le serveur.

• Enfin, nous retournons false pour que la page ne soit pas actualisée.

---

Maintenant, passons à la question. Lorsque vous utilisez ce code, vous devriez voir quelques choses dans votre console.Le premier sera probablement un message rouge avec quelque chose comme 500 internal server error, et le second devrait être le résultat du rappel d'erreur pour la fonction ajax. Vous pouvez obtenir encore plus de détails à ce sujet dans Chrome spécifiquement si vous cliquez sur l'onglet Réseau et parcourez les détails de la demande et de la réponse.

Je ne peux pas réparer votre PHP parce que vous ne l'avez pas posté, mais je suppose que vous suivrez soit avec un montage, soit vous calculerez vous même. Une fois le problème du serveur réglé, vous devriez obtenir un console.log propre avec la réponse que vous avez renvoyée, et vous pouvez aller de l'avant.

Sinon, cela fonctionnera en raison du manque de rafraîchissement de la page dans ce cas, vous pouvez ignorer les 2 paragraphes précédents et de déclarer la victoire:)

Hope this helps!

Answer 2

Ah, si damnés évidente. Vous n'annulez pas l'action de soumission par défaut, de sorte que le formulaire est soumis normalement. Ajouter ce

$("#login_form").submit(function (e) { 
    e.preventDefault(); 

    // and so on 

Voir http://api.jquery.com/event.preventDefault/

Answer 3

vous devez changer 2ème ligne et ajouter le e.preventDefault pour empêcher la forme de rafraîchir la page.

$("#login_form").submit(function (e) { 
    e.preventDefault(); 

Je voudrais également changer la requête AJAX à utiliser GET et modifier le code en PHP pour lire les variables de GET de sorte que vous pouvez facilement tester la page PHP fonctionne en cours d'exécution dans le navigateur comme celui-ci checkLogin. php? username = x & password = y

Answer 4

essayez ceci:

$("#login_form").submit(function() { 
    alert('started js'); 
    //get the username and password 
    var username = $('#username').val(); 
    var password = $('#password').val(); 

    //use ajax to run the check 
    $.post("../php/checklogin.php", { username: username, password: password }, function (result) { 
     alert('finished post'); 
     //if the result is not 1 
     if (result == '0') { 
     //Alert username and password are wrong 
      $('#login').html('Credentials wrong'); 
      alert('got 0'); 
     } 
    }, 'text'); 
}); 

1. }, 'text');

peut-être que le serveur ne donne pas le bon format de données. par exemple, si vous demandez json, et que jQuery ne peut pas convertir le résultat sting en json. alors la fonction ne serait pas exécutée et vous ne pourriez pas obtenir 'alert (' got 0 ');' chose.