Ajax allows web pages to asynchronously update parts of a page by exchanging data with a web server behind the scenes without reloading the entire page. It uses a combination of technologies like HTML/XHTML, CSS, DOM, XML, JavaScript, and the XMLHttpRequest object. This allows faster and more interactive web applications by reducing the amount of data sent and received.

1. AJAX Building faster dynamic websites - Asynchronous JavaScript and XML

2. Ajax Ajax is a group of web development methods used on the client-side to create interactive web applications. With Ajax, web applications can send data to , and retrieve data from , a server asynchronously (in the background) without interfering with the display and behavior of the existing page. Data are usually retrieved using the XMLHttpRequest object.

10. Beginners fall into trap. Why? Rare situations where it just doesn't make any sense at all to allow your visitor to continue interacting with the web page until a particular server side process completes. The only difference when using asynchronous calls is that you can actually set up multiple Ajax calls that overlap with a second call being made before the first has responded. This is where asynchronous Ajax does become slightly more complicated than synchronous Ajax because you need to make sure that each Ajax request uses a separate Ajax object rather than reusing the same object for all your Ajax requests

15. Ajax jQuery syntax jQuery.ajax( url, [settings] ) Or jQuery.ajax( settings ) Url : A string containing the URL to which the request is sent . Settings : A set of key/value pairs that configure the Ajax request . All settings are optional . A default can be set for any option with $.ajaxSetup() .

16. Settings Accepts ( Map -depends on Datatype): The content type sent in the request header that tells the server what kind of response it will accept in return. Async(Boolean-true): By default, all requests are sent asynchronously . If you need synchronous requests, set this option to false. Synchronous requests may temporarily lock the browser . BeforeSend(jqXHR, settings)- Function A pre-request callback function that can be used to modify the jqXHR object before it is sent. Used to set custom headers, etc.

17. Settings Cache(Boolean-true, false for DataType 'script' and 'jsonp'): If set to false, it will force requested pages not to be cached by the browser . Setting cache to false also appends a query string parameter, "_=[TIMESTAMP]" , to the URL. Complete(jqXHR, textStatus)-Function,Array A function to be called when the request finishes . Two arguments: The jqXHR object and a string categorizing the status of the request ("success", "notmodified", "error", "timeout", "abort", or "parsererror"). Contents(1.5) A map of string/regular-expression pairs that determine how jQuery will parse the response , given its content type.

18. Settings ContentType(String-'application/x-www-form-urlencoded‘) When sending data to the server, uses this content-type . Context(Object) This object will be made the context of all Ajax-related callbacks. Converters(Map) A map of dataType-to-dataType converters . Each converter's value is a function that returns the transformed value of the response.

19. Settings CrossDomain(Boolean-false for same-domain requests, true for cross-domain requests) Set the value of crossDomain to true for, server-side redirection to another domain . Data(Object) Data to be sent to the server . It is converted to a query string , if not already a string. It's appended to the url for GET-requests. Key-value pairs . DataType(String-Intelligent Guess-xml, json, script, or html) The type of data that you're expecting back from the server .

20. Settings Error(jqXHR, textStatus, errorThrown)- Function A function to be called if the request fails . TextStatus-"timeout", "error", "abort", and "parsererror“ and ErrorThrown- for HTTP errors. "Not Found" or "Internal Server Error.“ Global(Boolean-true) Whether to trigger global Ajax event handlers for this request. Set to false to prevent the global handlers like ajaxStart or ajaxStop from being triggered. Headers(1.5) A map of additional header key/value pairs to send along with the request. This setting is set before the beforeSend function is called; therefore, any values in the headers setting can be overwritten from within the beforeSend function.

21. Settings IfModified(Boolean-false) Allow the request to be successful only if the response has changed since the last request. IsLocal(1.5) Allow the current environment to be recognized as "local" (e.g. the filesystem) Jsonp(String) Override the callback function name in a jsonp request.

22. Settings JsonpCallback(String) Specify the callback function name for a JSONP request. MimeType(1.5) A mime type to override the XHR mime type. Password(String) and Username(String A password to be used in response to an HTTP access authentication request. ProcessData(Boolean-true) By default data is processed as QueryString. Any DOMDocument or non-processed data set it to false.

23. Settings ScriptCharset(String) Only for requests with "jsonp" or "script" dataType and "GET" type. Forces the request to be interpreted as a certain charset . StatusCode(1.5) A map of numeric HTTP codes and functions to be called when the response has the corresponding code. Success(data, textStatus, jqXHR) A function to be called if the request succeeds . Timeout(Number) Set a local timeout (in milliseconds) for the request.

24. Settings Type(String-GET) The type of request to make ("POST" or "GET"). Url(String- The current page) A string containing the URL to which the request is sent . Xhr(Function-ActiveXObject) Callback for creating the XMLHttpRequest object. XhrFields(Map) A map of fieldName-fieldValue pairs to set on the native XHR object . Ex: Set withCredentials to true for cross-domain requests if needed

26. AJAX on Hands

33. No Queries? THANK YOU