从SQL数据库使用PHP和JavaScript登录

Question

I have created a drop-down login panel (I am using Bootstrap 3.3.7), where I want the user to input the username and password used during registration.

If login is successful I want the user to be redirected to another page called profile.php else if login is not successful an error message will appear on the login panel footer. Here is my html code for the panel:

<li class="nav-link dropdown">
  <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><span class="glyphicon glyphicon-user"></span>Login</a>
  <div class="dropdown-menu" aria-labelledby="navbarDropdown">
    <div style="width:300px;">
      <div class="panel-heading text-center" style="color:black;">LOGIN</div>
      <div class="panel-heading">
        <label for="email">username</label>
        <input type="text" class="form-control" id="username">
        <label for="email">Password</label>
        <input type="password" class="form-control" id="password">
        <br>
        <a href="#" style="color:blue; list-style:none;">Forgotten password?</a><input type="submit" class="btn btn-success" style="float:right;" id="login" value="login">
      </div>
      <div class="panel-footer" id="login_msg"></div>
    </div>
  </div>
</li>

here is my javascript login code:

$("#login").click(function(event) {
  event.preventDefault();
  var u_name = $("#username").val();
  var pass = $("#password").val();
  $.ajax({
    url: "login.php",
    method: "POST",
    data: {
      userLogin: 1,
      userUname: u_name,
      userPassword: pass
    },
    success: function(data) {
      if (data == "truejsdhfkh") {
        window.location.href = "profile.php";
      } else {
        $("#login_msg").html(data);
      }
    }
  })
})

here is my php login code:

<?php
// connect to the database
include "db.php";
//session start
session_start();
//login page
if(isset($_POST['userLogin'])){

    $uname = mysqli_real_escape_string($con, $_POST['userUname']);
    $passwrd = mysqli_real_escape_string($con, $_POST['userPassword']);


    if(empty($uname) || empty($passwrd)){
        echo "
        <div class='alert alert-danger'>
            <a href='#' class='close' data-dismiss='alert' aria-label='close'>&times;</a><b>Please fill in all fields!</b>
        </div>
    ";
    exit();
    }else{
        $passwrd = md5($passwrd);
        $sql = "SELECT * FROM user_info WHERE username = '$u_name' AND passwrd = '$password'";
        $run_query = mysqli_query($con,$sql); 
        $count = mysqli_num_rows($run_query);
        if($count == 1){
            $row = mysqli_fetch_array($run_query);
            $_SESSION["uid"] = $row["user_id"];
            $_SESSION["uname"] = $row["username"];
            echo "truejsdhfkh";
    }
    }

}
?>

I am using a phpMyAdmin SQL database. The database name is user_info with the following columns: (user_id, username, first_name, last_name, email, passwrd, mobile, home_town)

When I click the login button nothing happens please help?

Answer 1

You have two typo in your query. The first one was pointed out in the comments and seems like it was corrected by you. The second one is that you are passing $password when it doesn't exists. You should pass $passwrd .

$sql = "SELECT * FROM user_info WHERE username = '$uname' AND passwrd = '$passwrd'";

                                                    ^^                    ^^
//Typos                                          $u_name                $password

Sorry for taking too much space but I can't add comments.