My Form looks like this:
<form id="invite-form" method="post" action="" >
<input type="text" name=friends[0][first_name] />
<input type="text" name=friends[0][last_name] />
<input type="text" name=friends[0][email] />
<input type="text" name=friends[1][first_name] />
<input type="text" name=friends[1][last_name] />
<input type="text" name=friends[1][email] />
<input type="text" name=friends[2][first_name] />
<input type="text" name=friends[2][last_name] />
<input type="text" name=friends[2][email] />
<input type="submit" value="Invite" />
</form>
And here is my javascript code:
var friends = [];
jQuery("#invite-form").serializeArray().map(function(x){friends[x.name] = x.value;});
var formData = {
'friends' : JSON.stringify(friends),
'action' : 'invite-friends'
};
jQuery.ajax({
type : 'POST',
url : '/invitation.php',
data : formData,
dataType : 'json',
encode : true
}).done(function(data){
console.log(data);
if(data.success == true){
...
It doesn't work properly and the list of friends is not POSTed properly. How do I convert this kind of form to json data properly? I want to be able to use this data as a regular array, as if it were a regular form POSTed.
In this way you can submit form with serialize data and you many use post or get request for this or any other method.
jQuery("#invite-form").submit(function(e) {
e.preventDefault();
let data = jQuery(this).serialize();
jQuery.ajax({
type: "get",
url: 'invitation.php',
data: data,
cache: false,
success: function(data){
console.log(data);
}
});
});