CODEWITHSUNDEEP
phpjqueryajax
Jim John
Jim John

Reputation: 9

AJAX > PHP Log in not working

I'm trying to create a log in form using html > ajax > php, the problem is the php is not working, I don't know where is the problem, I think the ajax cannot execute my php file. I need help. Thanks in advance.

Here is my HTML code: my form and inputs are below

          <form id="loginForm">
            <input type="text" data-clear-btn="true" name="username" id="username" value="" placeholder="Username / ID No.">
            <input type="password" data-clear-btn="true" name="password" id="password" value="" placeholder="Password">
            <input type="checkbox" name="rem_user" id="rem_user" data-mini="true">
            <label for="rem_user">Remember me</label>
            <input type="submit" name="login" id="login" value="Log in" class="ui-btn" />
          </form>
          <div class="err" id="add_err"></div>

AJAX script that sends request on my php file

    <script>
        $(document).ready(function(){
            $("#loginForm").submit(function(){
                var username = $("#username").val();
                var password = $("#password").val();
                // Returns successful data submission message when the entered information is in database.
                var dataString = 'username=' + username + '&password=' + password;
                    if (username == '' || password == ''){
                        alert("Please Fill All Fields");
                    }
                    else {
                    // AJAX Code To Submit Form.
                        $.ajax({
                            type: "POST",
                            url: "php/login-action.php",
                            data: dataString,
                            success: function(result){
                                window.location="#report_page";
                            }
                        });
                    }
                return false;
            });
        });
    </script>

PHP File

<?php

require "includes/connection.php";
include "includes/function.php";
if(isset($_POST['login'])){


    $username = $_POST['username'];
    $password = $_POST['password'];

    $username = sanitize($username);
    $password = sanitize($password);
    $pass2 = md5($password);
    $salt = "sometext";
    $validateHash = $salt.$pass2;
    $pass = hash("sha512", $validateHash);

    $sql = "SELECT * FROM user_login WHERE username='".$username."' and password='".$password."'";
    $result = mysqli_query($con,$sql) or die("Error: ". mysqli_error($con));

    $count=mysqli_num_rows($result);

    while($row=mysqli_fetch_array($result))
        {
            $id = $row['user_id'];
            $username = $row['username'];
            $name = "".$row['firstname']." ".$row['lastname']."";
            $acc_type = $row['Acc_Type'];
        }
        if($count==1){
            if($acc_type == 'user') {
                $_SESSION["id"] = $id;
                $_SESSION["username"] = $username;
                $_SESSION["name"] = $name;
                echo 'true';
            }
            else {
                echo 'false';
            }

        }


}
?>

Upvotes: 0

Views: 126

Answers (2)

Fas M
Fas M

Reputation: 427

try this, and if you get error state what it is

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
        $(document).ready(function(){
            $("#loginForm").submit(function(){

                    if (username == ' ' || password == ' '){
                        alert("Please Fill All Fields");
                    }
                    else {
                    // AJAX Code To Submit Form.
                        $.ajax({
                            type: "POST",
                            url: "php/login-action.php",
                            data: $(this).serialize(),
                            success: function(result){
                               alert('sucess'); //window.location="#report_page";
                            }
                        });
                    }
                return false;
            });
        });
    </script>

Upvotes: 0

Rick Su
Rick Su

Reputation: 16440

as Cattla mentioned in comments.

Your PHP is looking for $_POST['login'], and your $.ajax call didn't pass that in.

so here is the answer

var dataString = 'login=login&username=' + username + '&password=' + password;

Debug tips

  • Did ajax send all required inputs to PHP (you can inspect this from browser developer tool)
  • Did php receive all required inputs (you could var_dump($_POST)
  • Did php connect to mysql successfully
  • Did ajax receive data from PHP (use alert or console.log)

Upvotes: 1

Related Questions