Jquery Ajax form submit. I am using simple PHP code. just showing how it works. There have three steps HTML form, ajax function, and Ajax page.
let's start
index.php
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
function submit_myform()
{
var Fname=$("#FirstName").val();
var Lname=$("#LastName").val();
var data_pass='get_fname='+ Fname + '&get_lname='+Lname;
$.ajax({
url: 'ajax.php',
data: data_pass,
type: 'POST',
success: function(response)
{
$("#result").html(response);
}
});
}
</script>
</head>
<body>
<form action="">
First name: <input type="text" name="FirstName" id="FirstName" value=""><br><br>
Last name: <input type="text" name="LastName" id="LastName" value=""><br><br>
<span style="padding:10px;border: 1px solid;margin-top:10px;cursor:pointer" onclick="submit_myform()"> Submit </span>
</form>
<br><br>
<div id="result">
</body>
</html>
ajax.php
?php
if(isset($_REQUEST['get_fname']))
{
$FirstName=$_REQUEST['get_fname'];
$LastName=$_REQUEST['get_lname'];
echo 'Hi '.$FirstName.' Your Last Name is '.$LastName;
}
?>
Get the latest news and updates by signing up to our daily newsletter.We won't sell your email or spam you !