2016-08-01 22 views
0

Hey Leute, ich brauche Hilfe.Login-Prozess mit jQuery Ajax und PHP

Mein Problem ist der Fehler div zeigt nicht den Inhalt, ich möchte es in der Erfolgsfunktion meiner AJAX-Anfrage erscheinen. Ich habe versucht, die Antwort zu alarmieren, und sie gibt true zurück, wenn Benutzername und Passwort korrekt sind und gibt false zurück, wenn sie falsch ist.

Ich weiß nicht, warum es nicht funktioniert.

so ist dies mein Code

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

</head> 
<body> 

    <div class="container" name="main-div"> 
    <div id="error"> 
AA 
    </div> 
    <center> 
     <div name="login-div"> 
     <h2>LOGIN PAGE</h2> 
     <form method="post" class="login_form"> 
      Username: <input type="text" name="username"></br></br> 
      Password: <input type="password" name="password"></br></br> 
      <button type="submit" name="button_login" id="button_login">LOGIN</button> 
     </form> 
     </div> 
     </center> 
    </div> 

    <script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
    <script> 
    $(document).ready(function(){ 
    $("#button_login").click(function(){ 
     var data = $(".login_form").serialize(); 
     $.ajax({ 
     type: 'POST', 
     url: 'login_process.php', 
     data: data, 
     beforeSend: function(){ 
      alert(data); 
     }, 
     success : function(response){ 
      //alert(response); 
      if(response=="true"){ 
      $("#error").html("CORRECT USERNAME AND PASSWORD") 
      //window.location="home.php"; 
     }else{ 
      $("#error").html('<a>WRONG</a>'); 
      }); 
      } 
     } 
     }); 
    }); 
    }); 
    </script> 
</body> 
</html> 

Vielen Dank im Voraus

+0

Gibt es den String '' true'' oder einen booleschen 'true' zurück? weil ein Boolean wahrscheinlicher ist, also müssten Sie die Anführungszeichen von ungefähr dem "wahren" entfernen und vorzugsweise drei Gleichheitszeichen für eine strenge Prüfung von ihm benutzen, ist es gute Praxis. um nur 'console.log (typeof response) zu testen' –

+0

@MarkWalters ist eine Zeichenfolge .. Ich habe versucht, eine Warnung innerhalb der if-Anweisung hinzuzufügen, um zu überprüfen, ob es die Bedingung erfüllt und es tat –

+0

Ist das Element mit der ID 'error' vorhanden Die Seite? Haben Sie versucht, die Seite zu überprüfen und festzustellen, ob der Inhalt festgelegt wurde? Welcher HTML-Knoten ist '# error'? –

Antwort

0

Es gibt eine extra schließende Klammer in dem Skript, was Sie geschrieben hat. Versuchen Sie, die Seite im Chrom zu öffnen, und öffnen Sie die Entwicklerkonsole, um den Syntaxfehler zu sehen.

Login.html:44 Uncaught SyntaxError: Unexpected token) 

I korrigiert, um die Syntax wie unten

$(document).ready(function(){ 
$("#button_login").click(function(e){ 
e.preventDefault(); 
    var data = $(".login_form").serialize(); 
    $.ajax({ 
    type: 'POST', 
    url: 'login_process.php', 
    data: data, 
    beforeSend: function(){ 
     alert(data); 
    }, 
    success : function(response){ 
     //alert(response); 
     if(response=="true"){ 
      $("#error").html("CORRECT USERNAME AND PASSWORD") 
     //window.location="home.php"; 
     }else{ 
      $("#error").html('<a>WRONG</a>'); 
     } 
    }, 
    error : function(response) { 
     $("#error").html('error'+ error); 
    } 

    }); 
}); 

});

+0

ich habe die extra schließende Klammer entfernt ... aber sie lädt immer noch nicht. Ich beobachtete, dass die ganze Seite nach der gesamten Ajax-Anfrage aktualisiert, die den vorherigen Wert der Fehler div, die "AA" ist –

+0

Ich hatte den Code aktualisiert siehe der Ajax-Aufruf ist erfolgreich, überprüfen, ob es zum Erfolg oder Fehler Block geht . – CNKR