Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd Logo
Upload

Welcome to Scribd!

  • 260 views

    Case Study

    Uploaded by

    Tejas Jamdade
    AJAX allows for asynchronous data exchange in the background without interfering with the display and behavior of the existing page. This improves interactivity, makes for a more responsive interface, and optimizes bandwidth usage. Key aspects of AJAX include using XMLHttpRequest objects to asynchronously retrieve data from a web server and JavaScript to dynamically update and interact with page elements without reloading the entire page.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOCX, PDF, TXT or read online from Scribd

    Case Study

    Uploaded by

    Tejas Jamdade
    260 views5 pages
    AJAX allows for asynchronous data exchange in the background without interfering with the display and behavior of the existing page. This improves interactivity, makes for a more responsive interface, and optimizes bandwidth usage. Key aspects of AJAX include using XMLHttpRequest objects to asynchronously retrieve data from a web server and JavaScript to dynamically update and interact with page elements without reloading the entire page.

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    AJAX allows for asynchronous data exchange in the background without interfering with the display and behavior of the existing page. This improves interactivity, makes for a more responsive interface, and optimizes bandwidth usage. Key aspects of AJAX include using XMLHttpRequest objects to asynchronously retrieve data from a web server and JavaScript to dynamically update and interact with page elements without reloading the entire page.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    260 views5 pages

    Case Study

    Uploaded by

    Tejas Jamdade
    AJAX allows for asynchronous data exchange in the background without interfering with the display and behavior of the existing page. This improves interactivity, makes for a more responsive interface, and optimizes bandwidth usage. Key aspects of AJAX include using XMLHttpRequest objects to asynchronously retrieve data from a web server and JavaScript to dynamically update and interact with page elements without reloading the entire page.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    You are on page 1of 5
    At a glance
    Powered by AI
    The key takeaways are that AJAX allows for asynchronous data exchange with a server to update parts of a web page without reloading the entire page, resulting in a better user experience. It uses a combination of XMLHttpRequest, JavaScript, DOM and XML/JSON to asynchronously retrieve data from a server and update portions of a web page without reloading.

    The main components of AJAX are the XMLHttpRequest object, JavaScript, DOM, CSS, and XML/JSON. XMLHttpRequest is used to asynchronously exchange data with a server. JavaScript and DOM are used to display and interact with the information. CSS styles the data. XML or JSON are commonly used formats for transferring data.

    Some common use cases for AJAX applications include advanced GUI widgets/controls, refreshing data, real-time server-side form validation, and master-detail operations based on user selection.

    CASE STUDY: AJAX

    Introduction
    The word AJAX Stands for Asynchronous JavaScript and XML. AJAX is not a new programming language, but a new way to use existing standards. AJAX is the art of exchanging data with a server, and update parts of a web page - without reloading the whole page. This means that it is possible to update parts of a web page, without reloading the whole page. Examples of applications using AJAX such as Google Maps, Gmail, Youtube, and Facebook tabs. Web pages use JavaScript to make asynchronous calls to web-based services that typically return XML.It allows user to continue interacting with web page while waiting for data to be returned. Page can be updated without refreshing browser. It results in a better user experience. AJAX is based on internet standards, and uses a combination of XMLHttpRequest object (to exchange data asynchronously with a server), JavaScript/DOM (to display/interact with the information), CSS (to style the data), XML (often used as the format for transferring data).AJAX applications are browser- and platform-independent.

    Working of AJAX Steps of AJAX Operation 1. A client event occurs. 2 .An XMLHttpRequest object is created. 3. The XMLHttpRequest object is configured. 4. The XMLHttpRequest object makes an async.request.

    5. The ValidateServlet returns an XML document containing the result. 6. The XMLHttpRequest object calls the callback () function and processes the result. 7. The HTML DOM is updated. Asynchronous In this requests can be made asynchronously or synchronously both techniques allow web page to be updated without refreshing it. Anything useful the user can do while processing request? If yes then use asynchronous, otherwise use synchronous. Asynchronous communication with the server, first we create and send the request and code continues to run and control returns to the user. when the response comes back, it is handled. Benefit is responsiveness and drawback is increased complexity. Javascript Javascript is an object-oriented programming and scripting language that adds interactivity to HTML pages. It is embedded directly into the HTML of documents, and does not require a license to use it. It does not require any special software on the host, but does require browsers that support it. It is not the same as the Java Programming Language, although they are related. Javascript has a smaller set of codes and is easier for the average user to learn. Java is much more complex and allows the developer to create standalone applications, independent of HTML pages. JavaScript function is called when an event in a page occurs. It is dynamic and weakly typed. It is prototypebased with first-class functions. It is semantics similar to functional languages. Javascript is standardized as ECMAScript and supported by most modern browsers. But sometimes disabled for security reasons. Although standardized, browser-specific issues exist. Simple Javascript Example <html> <body> <script type="text/javascript"> <!--document.write("Hello World!") //--> </script></body> </html> Scripts can be entered in the head or body of the document, depending on where you want to execute them. You can also reference an external Javascript page with scripts that can be accessed by multiple pages :< script src="xxx.js"></script> XML XML stands for Extensible Markup Language. It is similar to HTML and is used to describe, share, and store data. Tags are not predefined. Commonly used as a data format for exchanging information with the server such as typically with REST-style web

    services . Other possibilities for data formats, often easier to parse and less verbose (network transfer) plain text and JSON. However you must define your own tags. RSS feeds are based on XML. Like XHTML, XML elements must have a closing tag, are case sensitive, and must be properly nested. Element Names Names can contain letters, numbers, and other characters Names must not start with a number or punctuation character Names must not start with the letters xml (or XML, or Xml, etc) Names cannot contain spaces Some Sample XML <?xml version="1.0" encoding="ISO-8859-1"?> <? xml-stylesheet type="text/css" href="cd_catalog.css"?> <CATALOG> <CD> <TITLE>Empire Burlesque</TITLE> <ARTIST>Bob Dylan</ARTIST> <COUNTRY>USA</COUNTRY> <COMPANY>Columbia</COMPANY> <PRICE>10.90</PRICE> <YEAR>1985</YEAR> </CD> <CD> <TITLE>Hide your heart</TITLE> <ARTIST>Bonnie Tyler</ARTIST> <COUNTRY>UK</COUNTRY> <COMPANY>CBS Records</COMPANY> <PRICE>9.90</PRICE> <YEAR>1988</YEAR> </CD>. </CATALOG> XMLHttpRequest It is First introduced by MS as an ActiveX object. The javascript XMLHttpRequest object is used to send a query to the server. It must not be a third party server. The query can be anything that is GET/POST/HEAD. The content comes back to the client (javascript) as an XML document. The client parses the XML and decides what to do (update part of the current HTML document, etc). Creating an XMLHttpRequest Object For IE: http_request = new ActiveXObject("Msxml2.XMLHTTP"); -or possibly

    http_request = new ActiveXObject("Microsoft.XMLHTTP"); Netscape/Mozilla/Firefox/Safari: http_request = new XMLHttpRequest (); XMLHttpRequest Properties readyState: Indicates that state of the transaction. 0: uninitialized, 1: loading ... 4 means "done". onreadystatechange: The callback function (async only). responseText: content of the reply as text. responseXML: top of the XML DOM document. status: HTTP status code (200, 404 ...). XMLHttpRequest Methods Open: specify the HTTP method, URL and async/sync Send: initiates the request. Can also specify POST data. Programming with Ajax Client side: 1. Building an HTTP request and sending it. 2. receiving HTTP reply Checking for errors including HTTP errors. 1. Parsing HTTP reply (typically an XML document). 2. Updating HTML elements in the current page. Server side: 1. Generating XML documents 2. The original HTML comes from the server...

    Usage cases for AJAX Advanced GUI widgets and controls > Controls such as tree controls, menus, and progress bars may be provided that do not require page refreshes. Refreshing data > HTML pages may poll data from a server for up-to-date data such as scores, stock quotes, weather, or application-specific data. Real-time server-side input form data validation > User IDs, serial numbers, postal codes. > Removes the need to have validation logic at both client side for user responsiveness and at server side for security and other reasons.

    Auto-completion > Email address, name, or city name may be auto-completed as the user types. Master detail operation > Based on a user selection, more detailed information can be fetched and displayed. Benefits of AJAX All the benefits of a 'traditional' web application. But allows for... increased responsiveness. More rapid user feedback. Richer user interactions. Desktop application 'look and feel'(More desktop-like UI widgets). Better bandwidth usage when only transferring the data that has changed. Current Issues of AJAX Complexity is increased > Server side developers will need to understand that presentation logic will be required in the HTML client pages as well as in the server-side logic. > Page developers must have JavaScript technology skills. AJAX-based applications can be difficult to debug, test, and maintain > JavaScript is hard to test - automatic testing is hard. > Weak modularity in JavaScript - namespace collision possible. > Lack of design patterns or best practice guidelines yet. Toolkits/Frameworks still maturing No standardization of the XMLHttpRequest yet > Future version of IE will address this. No support of XMLHttpRequest in old browsers > Iframe will help. JavaScript technology dependency & incompatibility > Must be enabled for applications to function. > Still some browser incompatibilities. JavaScript code is visible to a hacker > Poorly designed JavaScript code can invite security problem. AJAX Futures AJAX-enabled JSF Component libraries. Standardization of XMLHttpRequest. Better browser support. Better and Standardized Framework support. More best practice guidelines in the programming model.

    You might also like