You can use jQuery AJAX method to send any data to PHP form whether it’s a single input field or a complete form. There are several methods available in jQuery to perform this function.

In this article I am going to give you code which can be used to send complete HTML form to PHP using a specific ID attribute defined in

element.

HTML Code

<form id="myForm" method="POST">
<input name="username" type="text" />
<input name="password" type="password" />
<button id="submit">Click Here</button>
<div id="result"></div>
</form>

2016-03-29_18-57-47
jQuery Code

  $("#submit").click(function(e){
e.preventDefault();
var formData =  new FormData($("#myForm")[0]);
$.ajax({
url: 'file.php',
type: 'POST',
data: formData,
cache: false,
contentType: false,
processData: false,
success: function (msg) {
$("#result").html(msg);
},
error: function(){
alert("error in ajax form submission");
}
});
$("#result").html("Please Wait! Processing your Data..");
});

PHP Code – file.php

<?php
$username=$_POST['username'];
$password=$_POST['password'];
echo $username." ".$password;
?>

Note: Don’t forget to include jQuery library and always place your jQuery code after jQuery library (Recommended at footer)