ajaxppt
DESCRIPTION
TRANSCRIPT
AJAX
SUBMITTEDBY
MURTHY.CH.VSN &
J.RATNA PRASANTH
OUTLOOK INTRODUCTION
ABOUT
HTML
XHTML
CSS
JAVASCRIPT
WHAT IS AJAX ?
HOW AJAX WORKS ?
EXAMPLE
OUTPUT
FLOW CHART OF AJAX
AJAX SERVER
DRAWBACKS
CONCLUSION
INTRODUCTION
AJAX is about updating parts of a web page, without reloading the whole page.
Before to continue about AJAX we should have a basic understanding of the following:
HTML / XHTML
CSS
JavaScript / DOM
HTML: HTML defines the structure and layout of a Web document by using a variety of tags and attributes. The structure of an HTML
<html><head><body></body></HTML>.
XHTML:Extensible Hypertext Markup Language and which is a application of XML
CSS :"Cascading Style Sheet" are used to format the layout of Web pages. They can be used to define text styles, table sizes, and other aspects of Web pages that previously could only be defined in a page's HTML.
JAVASCRIPT:JavaScript is an object-oriented[4] scripting language used to enable programmatic access to objects within both the client application and other applications and it is mainly used for client-side JavaScript
What is AJAXWhat is AJAX?
AJAX = Asynchronous JavaScript and XML.
AJAX is a technique for creating fast and dynamic web pages.
AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes.
Ex of AJAX: Google Maps, Gmail, Youtube, and Facebook tabs.
AJAX applications are browser- and platform-independent!
How AJAX Works
<html><head><script type="text/javascript">function loadXMLDoc(url){if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); xmlhttp.open("GET",url,false); xmlhttp.send(null); }else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.open("GET",url,false); xmlhttp.send(); }document.getElementById('test').innerHTML=xmlhttp.responseText;}</script></head>
<body>
<div id="test"><h2>Let AJAX change this text</h2></div><button type="button" onclick="loadXMLDoc('test1.txt')">Click Me</button> <button type="button" onclick="loadXMLDoc('test2.txt')">Click Me</button>
</body></html>
OUTPUT Let AJAX change this text
Here the first button output shown in following slide,as well 2nd button
CLICK ME CLICK ME
AJAX is not a new programming language.
AJAX is a technique for creating fast and dynamic web pages.
CLICK ME
AJAX is based on internet standards, and uses a combination of:
* XMLHttpRequest object
* JavaScript/DOM
* CSS
* XML
CLICK ME
FLOWCHART OF AJAX
AJAX SERVER There is no such thing as an AJAX server.
XMLHttpRequest Object can Request any Data
With the XMLHttpRequest object, you can request any web resource from a server.
You can request TXT files, HTML files, XML files, pictures or any data.
DRAW BACKS Ajax interfaces are often harder to develop when compared to static
pages.
Pages dynamically created using successive Ajax requests do not automatically register themselves with the browser's history engine.
Dynamic web page updates also make it difficult for a user to bookmark a particular state of the application.
CONCLUSION AJAX allows us to build new and improved
ways of interacting with a Web page.
As a developers we need to remember that the product is not about the technologies.
It's about the users and how they interact with the product.
THANK ”U”