Jquery Ajax Form Submission

Question

I am trying to make a Ajax form Submission in Jquery. The form itself is loaded via an Ajax Event

The Form Element looks like this

<form id="create_user form" action="http://127.0.0.1/create_user" method="post">

  <p>Name
  <input type="text" name="name" value="" id="name"></p>
  <p>Employee Number:<br>
  <input type="text" name="emp_no" value="" id="emp_no"></p>
  <p>Email:<br>
  <input type="text" name="email" value="" id="email"></p>

  <p><input type="submit" name="submit" value="Save"></p>

  </form>

When loaded as html it works fine.

However I am trying to load it in another page via Ajax event

So the result looks like this

<div class="admin_main" id="admin_main">
<form id="create_user form" action="" method="post">

   .....Form......
<p><input type="submit" name="submit" value="Save"></p>
</form>

</div>

The Jquery code inside document ready function is

$("#admin_main").delegate("#create_user_form", "submit", function() {
    $.post('http://127.0.0.1/create_user', $("#create_user_form").serialize(), function (data) {
        $("#admin_main").html(data);
    }, "html");
});

However this has the effect of merely reloading the page. I have been at it for hours. Where am I going wrong?

Alin P. · Accepted Answer · 2010-10-09 19:16:33Z

1

I think you forgot the return: false; (or event.preventDefault() / event.stopPropagation() - not sure what is needed here) in the submit function. You definitely must stop the submit event somehow.

answered Oct 9, 2010 at 19:16

Alin P.

44.5k13 gold badges79 silver badges93 bronze badges

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

2 Comments

Mr Hyde Over a year ago

return: false; and event.preventDefault()>>>> tried both. Only the page reloads.

Mr Hyde Over a year ago

Hi, thanks for the answer. That was indeed the problem. function(e){.....} e.preventDefault();

Collectives™ on Stack Overflow

Jquery Ajax Form Submission

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