XMLHttpRequest
Display.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
Enter name:
<input type="text" id="name">
<button id="b1" onclick="fun()">Submit</button>
<p id="p1"></p>
<script type="text/javascript">
function fun(){
var str = document.getElementById("name").value;
var req = new XMLHttpRequest();
req.open("post","server.php?name="+str);
req.send();
req.onreadystatechange= function(){
if(req.readyState == 4 && req.status ==200){
document.getElementById("p1").innerHTML = req.responseText;
}
}
}
</script>
</body>
</html>
Jquery form =
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
Enter Name:
<input type="text" id="name"><br>
Enter email:
<input type="email" id="email"><br>
Enter password:
<input type="password" id="pass"><br>
Enter phone:
<input type="text" id="ph"><br>
<input type="submit" id="Submit" value="Submit">
<p id="p1"></p>
<script type="text/javascript">
$("document").ready(function(){
$("#Submit").click(function () {
var name = $("#name").val();
var email = $("#email").val();
var pass = $("#pass").val();
var ph = $("#ph").val();
$.ajax({
type: 'post',
url: 'server.php',
data: {name:name,email:email,pass:pass,ph:ph}
}).done(function(res){
$("#p1").html(res);
});
});
});
</script>
</body>
</html>
JSajax.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<p id="p1">
</p>
<button id="b1" onclick="fun()">Click</button>
<script type="text/javascript">
function fun(){
var req = new XMLHttpRequest();
req.open("GET","server.php",true);
req.send();
req.onreadystatechange= function(){
if(req.readyState == 4 && req.status ==200){
document.getElementById("p1").innerHTML = req.responseText;
}
}
}
</script>
</body>
</html>
server.php
<?php
$name = $_REQUEST['name'];
$email = $_REQUEST['email'];
$pass = $_REQUEST['pass'];
$ph = $_REQUEST['ph'];
echo "<br>My name is: ". $name;
echo "<br>My email is: ". $email;
echo "<br>My pass is: ". $pass;
echo "<br>My ph is: ". $ph;
?>
Comments
Post a Comment