Tuesday, 15 August 2017

Ajax-Code

HTML- AJAX-CODE ( This is for Asynchronous page)

<!-- code start here -->

if(window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
var xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {

document.getElementById("msg").innerHTML=this.responseText;
}
}
var url = "about.html";
xmlhttp.open("GET",url,true);
xmlhttp.send();

<!-- code end here -->

N.B: You have to change marked portion according to your code.

JQuery- AJAX-CODE ( This is for Asynchronous page):

<div class="col-sm-3">
<ul class="list-group">
<li class="list-group-item active"> Navigation </li>
<li class="list-group-item"> <a href="#" id="one">  Home </a></li>
<li class="list-group-item"> <a href="#" id="two">  Profile </a></li>
<li class="list-group-item"> <a href="#" id="three">  Edit Profile </a></li>

</ul>


</div> <!-- row 3 end -->
================================================================

$("#two").click(function(){

$.ajax({
type:"GET",
url:"profile.html",
//data:mydata,
success:function(response)
{
$("#msg").html(response);

}
});
}); // 2nd event end
************************************************************************"**
PHP- AJAX-CODE ( This is for Asynchronous page):


function saveuser()
{
var name = document.getElementById("fname").value;
var mobile = document.getElementById("mobile").value;
var msg = document.getElementById("msg").value;

var url = "savemyuser.php?n="+name+ "&m="+mobile+ "&msg="+msg;


// ajax code start here
if(window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
var xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {

alert(this.responseText);
}
}
//var url = "enter path action file";
xmlhttp.open("GET",url,true);
xmlhttp.send();

// ajax code end here

}
*********************************************************************************
PHP- JQuery-AJAX-CODE ( This is for Asynchronous page):

function saveuser()
{
//var url = "savemyuser.php?n="+name+ "&m="+mobile+ "&msg="+msg;

var name = $("#fname").val();
var mobile = $("#mobile").val();
var msg = $("#msg").val();


var mydata = {"n":name, "m":mobile, "msg":msg}; // JSON DATA

$.ajax({
type:"POST",
url: "savemyuser.php",
data: mydata,
success: function(response)
{
alert(response);
showuser();
}
});


}
======================================================================
<table class=" table table-bordered">

<caption><h2 class="text-center"> Contact Us </h2></caption>
<tr>
<th> Full Name </th>
<td> <input type="text" name="fname" id="fname" class="form-control" /> </td>
</tr>
.
.
.
.
.
.

</table>

**************************************************************************
















No comments:

Post a Comment

Download

https://drive.google.com/open?id=0BwJUPBOmHUUoLXA3TWdFQnRIeXc https://drive.google.com/file/d/1DMlCY1tycw-USBbs9kuxUtqo64fXRwU3/view?usp=...