JQuery $.post only works sometimes

Question

I have the following function:

function Login() {
    var username = document.getElementById('username').value;
    var password = document.getElementById('password').value;
     $.post("Login.php", {
             username: username,
             password:password
         }, function(data) {
             console.log(data);
         });
}

The issue that I'm having is that the function only runs sometimes. I had checked to see if it were a case that JQuery wasn't loaded upon the function running but it was. It doesn't really matter what text I input it simply works only sometimes. I think it has something to do with the $.post function.

Please see the following snaps of Chrome DevTools:

Sometimes it will do the above and the function will stop/end at line 67.

And other times it will go all the way through & work.

The above image shows me using the same input as the image before but this time the function stops/ends at line 67.

What could be causing this? I don't think it has anything to do with the variables themselves. The function is called when a button is clicked.

Update!

I'm seeing this error in the console. The page is also reloading so maybe before the post request could go through the web page would reload but I don't know how to solve this.

When the inputs are same as a previously executed `$.post`, the server call will be replaced by a fetching of results from cache. You can work around this by adding `$.ajaxSetup({ cache: false });` before your code, or by sending the current date as one of your inputs. More [here](https://stackoverflow.com/questions/4303829/how-to-prevent-a-jquery-ajax-request-from-caching-in-internet-explorer) and [here](https://stackoverflow.com/questions/5542701/setting-the-cache-in-jquery-post-to-be-false). — SNag, Aug 17 '17 at 07:07
@SNag: Your second link states that `$.post` is never cached, except on some devices. — Imanuel, Aug 17 '17 at 07:44
@SNag As per your references: "Pages fetched with POST are never cached" additionally, I'm using the browser in incognito mode to prevent and mishaps that would be cause by cache. Your comment doesn't assist me in rectifying the issue. Even on the first page load the function sometimes doesn't work. — DanielleS, Aug 17 '17 at 07:46
Please run the `$.post` directly in the console and see it always run, therefor your title for this topic is invalid.. please change it to better suit the *real* problem here. — vsync, Aug 17 '17 at 07:55
@DanielleS Have you checked whether your browser executed the call with the network tab in Chrome? — Imanuel, Aug 17 '17 at 07:55
what do you mean `The page is also reloading` ? why would it do that? does it also reloads when you manually run the `$.post()` in the console? — vsync, Aug 17 '17 at 09:54
@vsync The element that has the onclick function is a button so the button will automatically reload the page. I fixed it by adding "type="button" within the element. I've also provide an answer to my question. See answer below. — DanielleS, Aug 17 '17 at 09:58

score 0 · Answer 1 · edited Aug 17 '17 at 12:06

0

I've found the answer. There were two errors:

An issue with the html encoding as it relates to the password field.
There is a password_verify() function within the login.php file that takes a while to run which causes the post to fail.

edited Aug 17 '17 at 12:06

vsync

118,978
58
307
400

answered Aug 17 '17 at 08:56

DanielleS

47
2
8

1

so the title for this question is wrong. `$.post` always works. it's not a jQuery issue (obviously) but a server issue apperently.. you can rename the title – vsync Aug 17 '17 at 12:05

JQuery $.post only works sometimes

1 Answers1