Introduction to AJAX...

Before learning AJAX, you should have to know the fundamental ideas about HTML and JavaScript. AJAX stands for Asynchronous JavaScript and XML. AJAX is not a programming language. It is a technique to create better, faster, and more interactive web applications with the help of HTML, CSS, XML and Java Script. AJAX is nothing but a updated parts of a web page, without reloading the whole page. There are various applications using AJAX: Google Maps, Gmail, YouTube, and Facebook. AJAX is based on internet standards, and uses a combination of: XMLHttpRequest object (to retrieve data from a web server) and JavaScript/DOM (to display/use the data)
AJAX was made popular in 2005 by Google, with Google Suggest.
Now we will see a simple AJAX example:

Example

<!DOCTYPE html>
<html>
<body>
<div id="id1"><h1>AJAX can change the content</h1></div>
<button type="button" onclick="show()">Change</button>
<script>
function show()
{
var x = new XMLHttpRequest();
x.onreadystatechange = function()
{
if (x.readyState == 4 && x.status == 200)
{
document.getElementById("id1").innerHTML = x.responseText;
}
};
x.open("GET", "ajax_info.txt", true);
x.send();
}
</script>
</body>
</html>

Explanation

HTML Page

Example

<!DOCTYPE html>
<html>
<body>
<div id="id1"><h1> AJAX can change the content </h1></div>
<button type="button" onclick="show()">Change /button>
</body>
</html>

Example

Function show()
function show()
{
var x = new XMLHttpRequest();
x.onreadystatechange = function()
{
if (x.readyState == 4 && x.status == 200)
{
document.getElementById("id1").innerHTML = x.responseText;
}
};
x.open("GET", "ajax_info.txt", true);
x.send();
}


  Tutorials

Popular Links

Contact Us

address Plot No-N6/530,2ND Floor
Nayapalli,Jayadev Vihar
      Bhubaneswar-751015
      Email: info@silantechnology.com
      Phone: 0674-2361252
address
39877, sundale dr, apt#101, Fremont, California 94538, USA
       Phone: +1(262)388-7619

facebook twitter google linked in

© 2018 Silan Technology. All Rights Reserved