CODEWITHSUNDEEP
javascriptjquery
user6322822
user6322822

Reputation:

Post form within a div

What I'm trying to achieve is similar to how the links that are clicked within the div load only within the div but instead with forms so any forms posted within the div are loaded within the div.

So for example if I have a form inside the #profile-body;

<form method="POST" action="/post.php">
<input name="test" type="text"/>
<input type="submit"/>
</form>

when the form has been submitted the action page is loaded within the div.

$(function(){
    $(document).on('click', '.profile-body, #profile-body a',function(e){
         e.preventDefault();// prevent browser from opening url
         $('#profile-body').load(this.href);
    });
});
$(document).ready(function() {
    var defaultPage = "defaultpage.html";
    $('#profile-body').load(defaultPage);
});

<div id="profile-body"></div>

My question is how would I get the form posted page to be loaded in the div.

Upvotes: 1

Views: 69

Answers (1)

A. Wolff
A. Wolff

Reputation: 74420

load() can use POST method if some object data is passed. So you should try something like that:

$('div > form').on('submit', function(e) {
  e.preventDefault();
  $(this).parent('div').load(this.action, $(this).serializeArray());
});

Upvotes: 1

Related Questions