SlideShare ist ein Scribd-Unternehmen logo
1 von 23
AJAX –  Asynchronous JavaScript and XML Vijay Khambalkar Magnet Technologies Pvt. Ltd.
What is AJAX ? Ajax is just a style of design, one that makes feel less web and more desktop
Why AJAX ? ,[object Object],[object Object],[object Object]
AJAX Characteristics : ,[object Object],[object Object],[object Object]
Ajax Lifecycle
How to use AJAX practically ? ,[object Object],[object Object]
XmlHttpRequest ? ,[object Object],[object Object],[object Object],[object Object]
XmlHttpRequest Component ,[object Object],[object Object],[object Object],[object Object],[object Object]
Let’s see some coding : var req; function retrieveURL(url) {      if (window.XMLHttpRequest) // Non-IE browsers {        req = new XMLHttpRequest();      }  else if (window.ActiveXObject) // IE {        req = new ActiveXObject("Microsoft.XMLHTTP");      }       req.open("GET", url, true);       req.onreadystatechange = processStateChange;       req.send(null);    }
Let’s see some coding : function processStateChange() {      if (req.readyState == 4) // Complete {        if (req.status == 200) // OK response {          document.getElementById(“MyContent").innerHTML = req.responseText;        }       }    }  
Who created AJAX ? ,[object Object],[object Object],[object Object]
AJAX with PHP
Coding : PHP [server.php] ,[object Object],[object Object],[object Object],[object Object]
Coding: Javascript [client.htm] ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Coding: Javascript [client.htm] ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Coding: Javascript [client.htm] ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
AJAX Libraries in PHP ,[object Object],[object Object],[object Object],[object Object]
Lets Try Out Example
When to go the AJAX way ? “  Not Always !!! Abuse of any technology would make it a liability !!! ”
Where has AJAX been used ? ,[object Object],[object Object],[object Object],[object Object],[object Object]
Limitations of AJAX ,[object Object],[object Object],[object Object]
Summary
Thank You

Weitere ähnliche Inhalte

Was ist angesagt?

Developing great applications using ASP.NET MVC and ASP.NET AJAX
Developing great applications using ASP.NET MVC and ASP.NET AJAXDeveloping great applications using ASP.NET MVC and ASP.NET AJAX
Developing great applications using ASP.NET MVC and ASP.NET AJAX
Tatham Oddie
 

Was ist angesagt? (20)

Ajax Presentation
Ajax PresentationAjax Presentation
Ajax Presentation
 
Ajax Ppt 1
Ajax Ppt 1Ajax Ppt 1
Ajax Ppt 1
 
Ajax.ppt
Ajax.pptAjax.ppt
Ajax.ppt
 
Ajax and RJS
Ajax and RJSAjax and RJS
Ajax and RJS
 
Introduction to ajax
Introduction  to  ajaxIntroduction  to  ajax
Introduction to ajax
 
Developing great applications using ASP.NET MVC and ASP.NET AJAX
Developing great applications using ASP.NET MVC and ASP.NET AJAXDeveloping great applications using ASP.NET MVC and ASP.NET AJAX
Developing great applications using ASP.NET MVC and ASP.NET AJAX
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
Advantages and disadvantages of an ajax based client application
Advantages and disadvantages of an ajax based client applicationAdvantages and disadvantages of an ajax based client application
Advantages and disadvantages of an ajax based client application
 
Extending Ajax Events for all mankind
Extending Ajax Events for all mankindExtending Ajax Events for all mankind
Extending Ajax Events for all mankind
 
Beyond HTML: Tools for Building Web 2.0 Apps
Beyond HTML: Tools for Building Web 2.0 AppsBeyond HTML: Tools for Building Web 2.0 Apps
Beyond HTML: Tools for Building Web 2.0 Apps
 
Marketing Automation with dotCMS
Marketing Automation with dotCMSMarketing Automation with dotCMS
Marketing Automation with dotCMS
 
Ajax3
Ajax3Ajax3
Ajax3
 
Overview of AJAX
Overview of AJAXOverview of AJAX
Overview of AJAX
 
AJAX
AJAXAJAX
AJAX
 
Ajax
AjaxAjax
Ajax
 
Ajax Presentation for the TSSG
Ajax Presentation for the TSSGAjax Presentation for the TSSG
Ajax Presentation for the TSSG
 
Introduction about-ajax-framework
Introduction about-ajax-frameworkIntroduction about-ajax-framework
Introduction about-ajax-framework
 
Ajax assignment help
Ajax assignment helpAjax assignment help
Ajax assignment help
 

Andere mochten auch

THECONTENT|FACTORY overview
THECONTENT|FACTORY overviewTHECONTENT|FACTORY overview
THECONTENT|FACTORY overview
Layth Dajani
 
Revelion 2010 Londra
Revelion 2010 LondraRevelion 2010 Londra
Revelion 2010 Londra
exploretravel
 
IADR 2010
IADR 2010IADR 2010
IADR 2010
miletic
 
Triade, First Ship With Ofoil Propulsion
Triade, First Ship With Ofoil PropulsionTriade, First Ship With Ofoil Propulsion
Triade, First Ship With Ofoil Propulsion
Bas Goris
 

Andere mochten auch (18)

THECONTENT|FACTORY overview
THECONTENT|FACTORY overviewTHECONTENT|FACTORY overview
THECONTENT|FACTORY overview
 
WSI4Success Website examples
WSI4Success Website examplesWSI4Success Website examples
WSI4Success Website examples
 
Revelion 2010 Praga
Revelion 2010 PragaRevelion 2010 Praga
Revelion 2010 Praga
 
La Propuesta
La PropuestaLa Propuesta
La Propuesta
 
Solidwaste
SolidwasteSolidwaste
Solidwaste
 
Navigating Identities
Navigating IdentitiesNavigating Identities
Navigating Identities
 
2013automatedelection
2013automatedelection2013automatedelection
2013automatedelection
 
Revelion 2010 Londra
Revelion 2010 LondraRevelion 2010 Londra
Revelion 2010 Londra
 
IADR 2010
IADR 2010IADR 2010
IADR 2010
 
My world peace diet recipes
My world peace diet recipesMy world peace diet recipes
My world peace diet recipes
 
De guerrilla van intranet- en webmanagement
De guerrilla van intranet- en webmanagementDe guerrilla van intranet- en webmanagement
De guerrilla van intranet- en webmanagement
 
5 dingen die klanten echt van je willen
5 dingen die klanten echt van je willen5 dingen die klanten echt van je willen
5 dingen die klanten echt van je willen
 
Top user tasks in 'static' and 'mobile' contexts
Top user tasks in 'static' and 'mobile' contexts Top user tasks in 'static' and 'mobile' contexts
Top user tasks in 'static' and 'mobile' contexts
 
Content inventariseren en beoordelen
Content inventariseren en beoordelenContent inventariseren en beoordelen
Content inventariseren en beoordelen
 
De guerrilla van klantgericht werken - KCC Congres 2015
De guerrilla van klantgericht werken - KCC Congres 2015De guerrilla van klantgericht werken - KCC Congres 2015
De guerrilla van klantgericht werken - KCC Congres 2015
 
Triade, First Ship With Ofoil Propulsion
Triade, First Ship With Ofoil PropulsionTriade, First Ship With Ofoil Propulsion
Triade, First Ship With Ofoil Propulsion
 
Toptaken en de klantgerichte website nee organisatie
Toptaken en de klantgerichte website nee organisatieToptaken en de klantgerichte website nee organisatie
Toptaken en de klantgerichte website nee organisatie
 
TPS Characteristics
TPS CharacteristicsTPS Characteristics
TPS Characteristics
 

Ähnlich wie mukesh

Ajax: User Experience
Ajax: User ExperienceAjax: User Experience
Ajax: User Experience
petrov
 
AJAX
AJAXAJAX
AJAX
ARJUN
 
Using Ajax In Domino Web Applications
Using Ajax In Domino Web ApplicationsUsing Ajax In Domino Web Applications
Using Ajax In Domino Web Applications
dominion
 

Ähnlich wie mukesh (20)

Ajax
AjaxAjax
Ajax
 
Ajax: User Experience
Ajax: User ExperienceAjax: User Experience
Ajax: User Experience
 
Building Applications Using Ajax
Building Applications Using AjaxBuilding Applications Using Ajax
Building Applications Using Ajax
 
Ajax
AjaxAjax
Ajax
 
Pracitcal AJAX
Pracitcal AJAXPracitcal AJAX
Pracitcal AJAX
 
SynapseIndia dotnet development ajax client library
SynapseIndia dotnet development ajax client librarySynapseIndia dotnet development ajax client library
SynapseIndia dotnet development ajax client library
 
What is Ajax technology?
What is Ajax technology?What is Ajax technology?
What is Ajax technology?
 
M Ramya
M RamyaM Ramya
M Ramya
 
Ajax
AjaxAjax
Ajax
 
Ajax Introduction
Ajax IntroductionAjax Introduction
Ajax Introduction
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
Asynchronous JavaScript & XML (AJAX)
Asynchronous JavaScript & XML (AJAX)Asynchronous JavaScript & XML (AJAX)
Asynchronous JavaScript & XML (AJAX)
 
AJAX
AJAXAJAX
AJAX
 
Ajax presentation
Ajax presentationAjax presentation
Ajax presentation
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
Ajax
AjaxAjax
Ajax
 
01 Ajax Intro
01 Ajax Intro01 Ajax Intro
01 Ajax Intro
 
Using Ajax In Domino Web Applications
Using Ajax In Domino Web ApplicationsUsing Ajax In Domino Web Applications
Using Ajax In Domino Web Applications
 

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 

mukesh

  • 1. AJAX – Asynchronous JavaScript and XML Vijay Khambalkar Magnet Technologies Pvt. Ltd.
  • 2. What is AJAX ? Ajax is just a style of design, one that makes feel less web and more desktop
  • 3.
  • 4.
  • 6.
  • 7.
  • 8.
  • 9. Let’s see some coding : var req; function retrieveURL(url) {     if (window.XMLHttpRequest) // Non-IE browsers {       req = new XMLHttpRequest();     } else if (window.ActiveXObject) // IE {       req = new ActiveXObject("Microsoft.XMLHTTP");     }      req.open("GET", url, true);      req.onreadystatechange = processStateChange;      req.send(null);   }
  • 10. Let’s see some coding : function processStateChange() {     if (req.readyState == 4) // Complete {       if (req.status == 200) // OK response {         document.getElementById(“MyContent").innerHTML = req.responseText;       }     }   }  
  • 11.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18. Lets Try Out Example
  • 19. When to go the AJAX way ? “ Not Always !!! Abuse of any technology would make it a liability !!! ”
  • 20.
  • 21.

Hinweis der Redaktion

  1. AJAX – has taken IT industry by storm. It might turn out to be one of the most demanded thing/in thing and hence, a brief presentation to understand AJAX. Be it anything that we are learning, asking 6 key questions is very important to get an overall idea of the same. The questions being – What, Why, Who, How, When and Where. So let’s being with what is AJAX? – not a technology, not a product … but an approach taken to develop Web Applications.
  2. Inorder to understand what is this approach all about … let us first seek to know what the current approach is … At present, for every user interaction, the entire web page is rebuild. Even if a part of the entire page needs to be changed … we land up reloading the entire page. Which leads to … network traffic … slow speed … and most importantly … user experience goes down … user has to wait for loading of images … controls … which had already been loaded once!!! This is what AJAX asks us not to do.
  3. Continuous Feel: Traditional web applications force you to submit a form, wait a few seconds, watch the page redraw, and then add some more info. Forgot to enter the area code in a phone number? Start all over again. Sometimes, you feel like you're in the middle of a traffic jam: go 20 metres, stop a minute, go 20 metres, stop a minute ... How many E-Commerce sales have been lost because the user encountered one too many error message and gave up the battle? Ajax offers a smooth ride all the way. There's no page reloads here - you're just doing stuff and the browser is responding. Real-Time Updates: As part of the continous feel, Ajax applications can update the page in real-time. Currently, news services on the web redraw the entire page at intervals, e.g. once every 15 minutes. In contrast, it's feasible for a browser running an Ajax applciation to poll the server every few seconds, so it's capable of updating any information directly on the parts of the page that need changing. The rest of the page is unaffected. Graphical Interaction: Flashy backdrops are abundant on the web, but the basic mode of interaction has nevertheless mimicked the 1970s-style form-based data entry systems. Ajax represents a transition into the world of GUI controls visible on present-day desktops. Thus, you will encounter animations such as fading text to tell you something's just been saved, you will be able to drag items around, you will see some static text suddenly turn into an edit field as you hover over it.