Sebastian Dine Sebastian Dine - 2 years ago 91
Javascript Question

jQuery $.post-function | data-processing function does not work

I am new in web development, but having years of experience in traditional development, e.g. using Java, C and ABAP, under my belt.

I am trying to create a pretty simple Login-functionality, but struggling with jQuery's


In the below seen code, the
-function in the data-processing part of
doesn´t seem to get executed, after I submit the form
. I guess the problem is with how I connected the JavaScript-function
with the submitting of form

<!DOCTYPE html>

<script src="jquery-2.2.4.min.js"></script>

function login_attempt(){
$.post("login.php", $("#form_login").serialize(), function(data){alert("test");},html);

<form id="form_login" method="post" onsubmit="return login_attempt()">
<p><label for="id_username">Username: </label><input id="id_username" name="username" type="text" width="20"></label></p>
<p><label for="id_password">Password: </label><input id="id_password" name="password" type="password" width="10"></label></p>
<p><input type="submit" name="submit_login"></p>


Answer Source

The function login_attempt is now triggered when submitting the form and then after that the form is submitted as well since the login_attempt function does not tell the form to stop submitting in the regular way. Therefor the page reloads before the actual callback of the post method could do anything.

Add return false; as last line of the login_attempt function to tell the form it should not submit in the regular way.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download