2016-04-07 29 views
-1

Sadece ajax ve php kullanarak basit bir giriş sayfası oluşturmak istiyorum. Kullanıcı adı ve şifre girişi ve onay kutusu (şimdi işe yaramaz) ve düğmesi olan bir form vardır.Ajax ile Temel Giriş Doğrulama

<?php 
    if(isset($_SESSION['user_session'])) 
    { 
    header("Location: home.php"); 
    exit; 
    } 
    ?> 

<!DOCTYPE html> 
<html> 
    <head> 

     <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
     <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.min.js"></script> 
    <link rel="stylesheet" href="CSS/login.css"> 

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 

    <title>Login</title> 

    </head> 
    <body> 
    <div class="main"> 
     <img class="backImage" src="img/typewriter.jpg" /> 
     <div id="login"> 
      <div class="formClass"> 
       <form class="loginForm" method="post"> //login form to validate 
        <div class="form-group"> 
         <label for="userName">User Name</label> 
         <input type="text" class="form-control" id="username" placeholder="User Name"> 
        </div> 
        <div class="form-group"> 
         <label for="password">Password</label> 
         <input class="form-control" type="password" id="password" placeholder="Password"> 
        </div> 
        <div class="checkbox"> 
         <label> 
          <input type="checkbox"> Remember Me 
         </label> 
        </div> 
        <button type="submit" class="btn btn-primary" id="submitButton">Login</button> 
       </form> 
      </div> 
     </div> 
    </div> 
    <script> 
      $(document).ready(function() { 
      $('.loginForm').validate({ 
     rules: { 
      username: { 
       required: true, 
       minlength: 5, 
       maxlength: 18 
      }, 
      password: { 
       required: true, 
       minlength: 5, 
       maxlength: 14 
      } 
     }, 
     submitHandler: submitForm 
    }); 
    function submitForm(){ 
       var strAjax = $('.loginForm').serialize(); // get the input values 
       $.ajax({ 
        type: 'POST', 
        url: 'logAjax.php', 
        data: strAjax, 
        cache: false, 
        success: function(data) { 
      alert(data); 
         if(data == true) { 
          window.location.href = "home.php"; // if response is true, then user can go home page 
         } 
         else { 
       alert("false"); // this is just for control purpose 
         } 
        } 
       }); 
       return false; 
       } 
     }); 
     </script> 
    </body> 
</html> 

Ve php dosyası::

İşte bu benim giriş sayfası

<?php //this is also too simple. just connect the database, control input values and response 
    include_once 'dbcon.php'; 

    $username = mysqli_real_escape_string($conn, $_POST["username"]); 
    $password = mysqli_real_escape_string($conn, $_POST["password"]); 

    $sql = "SELECT * FROM tbl_user WHERE userName = '$username' AND password = '$password'"; 

    $result = mysqli_query($conn, $sql); 
    $count = mysqli_num_rows($result); 
    $row = mysqli_fetch_array($result); 

    if($count == 1){ 
     $_SESSION['user_session'] = $row['userName']; 
     echo TRUE; 
    } 
    else { 
     echo FALSE; 
    } 
    exit; 
?> 

Ama çalıştırmak ve bunun yerine kullanıcı gibi hata mesajı şey almanın, doğrulama kurallarını kırmaya çalıştığınızda ad gerekli, giriş değerleri olmadan doğrudan php dosyasına gönderilir. Bu yüzden $ _POST ["username"] ve $ _POST ["password"] için bir hata mesajı alıyorum. Ayrıca veritabanında bulunan gerçek kullanıcı adı ve şifreyi denediğimde aynı senaryo devam ediyor. Formu doğrulayamaz sadece ajax kısmını çalıştırın. Bu problemi nasıl çözebilirim? Sorun nedir?

+0

Sanırım giriş düğmeniz javascript işlevini çağırmadan formu gönderiyor. Göndermek için #submitButton'unuza bir onclick koymaya çalışınForm(). Ve varsayılanı engellemeyi unutmayın. –

+0

Javascript ve çalışmasında aslında uyarı işlevini deniyorum. Sadece doğrulamak değil ama neden ne yazık ki bilmiyorum ne – kimdirbilmem

cevap

1

Sorun, rules bölümündeki anahtarların, kimliğin değil, alanın adı olması gerektiğidir. Alanlarınızda bir isim yok. Bunun da formun serileştirilmesiyle ilgili bir soruna yol açacağına inanıyorum. Bunun yerine deneyin.

<div class="form-group"> 
     <label for="userName">User Name</label> 
     <input type="text" class="form-control" id="username" name="username" placeholder="User Name"> 
</div> 
<div class="form-group"> 
    <label for="password">Password</label> 
    <input class="form-control" type="password" id="password" name="password" placeholder="Password"> 
</div> 
+0

hangi OP daha önce yaptım ve asla yanıt vermedi, bu yüzden silme sona erdi. –

İlgili konular