PaulPolon PaulPolon - 6 months ago 9
Javascript Question

$.post doesn't seem to work

There are a couple of

calls in the jQuery which are showing up, but the
inside the
does not seems to respond. I already tested the PHP code and it works fine. I think it is my
, but I already check them before.

<form id="login-form" method="post" class="form-inline" target="_top">
<input type="text" tabindex="2" id="username" placeholder="Username" name="email" class="inputtext">
<input type="password" tabindex="3" id="userpass" placeholder="Password" name="pass" class="inputtext">
<button tabindex="4" id="loginButton">Login</button>

$(document).ready(function(e) {
$('#loginButton').click(function(e) {
alert("start function");
$.post('../php/login.php', {
'username': $('#username').val(),
'userpass': $('#userpass').val()
}, function(data){
alert("end function");


$queryStmt = 'SELECT user_first, user_last FROM users WHERE user_name=:sqlIdName AND user_password=:sqlPass';
$queryPrepare = $dba_connect->prepare($queryStmt);
$queryResult = $queryPrepare->fetch(PDO::FETCH_ASSOC);


if ($queryResult == false)
return false;
return true;

My file structure is this:

File Structure


The button is actually submitting the form normally as you have not given it a type="button" attribute, nor are you using preventDefault() on the click event itself.

Regardless of that, it is much better practice to hook to the submit event of the form, not the click of the button. Try this:

    e.preventDefault(); // stop standard form submission
    $.post('../php/login.php', {
        'username': $('#username').val(),
        'userpass': $('#userpass').val()
    }, function(data){

You may also want to return something other than a boolean value from your PHP code, as it will just be turned in to a single string response. JSON would seem to be the best fit for your case, check out the json_encode function.

Finally, note that you should always use console.log for debugging as it does not coerce data types.