PHP, AJAX Login script not doing what I want

Question

I'm trying to make a simple login script and I've started with just trying to verify an email address. Essentially, from my login screen I am entering a valid email address and submitting it which should run AJAX to run a PHP function. I've scoured the internet all of last night and this morning trying different methods but I keep hitting dead ends.

To keep it brief here is the relevant code:

app.js

$(document).ready(function() {
    $("submit").click(function() {
        alert("This was a test.");
        $.ajax({
            type: "POST",
            url: "main_login.php",
            success: function(data) {
                alert(data);
                $(".message").text(data);
            }
        });
    });
});

main_login.php

<?php
    function checkLogin()
        $conn = new mysqli('localhost', 'user', 'pass!', 'db');
        mysqli_set_charset($conn, 'utf8mb4');
        $check = "SELECT * FROM users WHERE email = '$_POST[email]'";
        $results = mysqli_query($conn, $check);
        $data = mysqli_fetch_array($results, MYSQLI_NUM);
        if($data > 1) {
            echo "Login successful";
        } else {
            echo "This account does not exist";
        }

        $conn->close();
    }
?>

login.php

<div class="container login">
    <div class="panel panel-default login-panel">
        <div class="panel-heading">span class="log-h1">Sign-in</span>
        </div>
        <div class="panel-body">
            <form name="loginform" action="login.php" method="post">
            <div class="form-group">
                <label for="username">Email</label>
                <input type="email" class="form-control"
                 name="email" id="email" placeholder="Email address">
            </div>
            <div class="form-group" style="float: right;">
                <input type="submit" class="btn btn-primary" name="Submit" 
                 value="Sign-in">
            </div>
            </form>
            <span class='message'></span>
        </div>
    </div>
</div>

I'm not getting anything happening. The page notifies me when I refresh it that it may resend data but when i submit my email it doesn't do anything.

Any errors showing? Did you check the console (CTRL + F12 on Chrome)? — Script47
– Script47, Commented Oct 24, 2015 at 14:21
The errors I did have I just fixed and tried again but to no avail. When I hit the submit button it does reload the page; however, I don't get anything else other than a refresh it looks like. — Jacob Johnson
– Jacob Johnson, Commented Oct 24, 2015 at 14:27
You're using mysqli_fetch_array to get your data from your recordset, but there's no error checking to make sure that your query has worked. Also, you can simplify your code - if ($row = mysqli_fetch_array($results)) will return false if there are no matching results — andrewsi
– andrewsi, Commented Oct 24, 2015 at 14:37
Try using preventDefault() at beginning of jQuery submit binding? — An0nC0d3r
– An0nC0d3r, Commented Oct 24, 2015 at 14:40

An0nC0d3r · Accepted Answer · 2015-10-24 15:32:38Z

1

It maybe due to the fact that your not preventing the default form behaviour of "submit", despite binding to the click event via jQuery, try this...

JS

$(document).ready(function() {
    $("#submit-button").click(function(e) {
        e.preventDefault(); 
        alert("This was a test.");
        $.ajax({
            type: "POST",
            url: "main_login.php",
            success: function(data) {
                alert(data);
                $(".message").text(data);
            }
        });
    });
});

HTML

<input id="submit-button" type="submit" class="btn btn-primary" name="Submit" value="Sign-in">

edited Oct 24, 2015 at 15:32

answered Oct 24, 2015 at 14:42

An0nC0d3r

1,29316 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jacob Johnson Over a year ago

I'm getting the same results.

An0nC0d3r Over a year ago

Are you getting any errors in the console inspector?

Collectives™ on Stack Overflow

PHP, AJAX Login script not doing what I want

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related