SlideShare a Scribd company logo
1 of 32
Welcome to One & AllG    d Day Seminar on  AJAX
AJAX :Asynchronous JavaScript And XML
Back then : Click Search
And you get this :
These days :
The magic spell behind this is :AJAX
So what is Ajax ? ,[object Object]
 A new technology – not exactly…
 So what else ? It is a methodology on using several web technologies together, in an effort to close the gap between the usability and interactivity of a desktop application and the ever demanding web application 
Order of Developments Internet Explorer introduces the concept of IFrame element in 1996.(a technique that helps in loading the contents of a web page.) In the year 1998, Microsoft introduces another technique, called ‘Microsoft’s Remote Scripting’ as a replacement to the older techniques.
A year later, in 1999, Microsoft introduces the XMLHttpRequest object, an ActiveX control, in IE 5.  The term AJAX is coined on February 18, 2005, by Jesse James Garret in a short essay published a few days after Google released its Maps application.
Finally, in the year 2006, the W3C (World Wide Web Consortium) announces the release of the first draft which includes the specification for the object (XHR) and makes it an official web standard.
Why Ajax is important ? ,[object Object]
Developers can now provide user interfaces that are nearly as   responsive and rich as more traditional Windows Forms applications while taking advantage of the Web's innate ease of deployment and heterogeneous, cross-platform nature.
These benefits have been shown to dramatically reduce software maintenance costs and increase its reach. You can use AJAX to load specific portions of  a page that need to be changed.
It further reduces network traffic.,[object Object]
The process cycle
A little about XHR object
The readyState values
A few status values
Let’s get to some work 
Example ( cont...)
( cont...)
Output page looks like this :
Interactive mouse-overs
Here comes another Ajax example — one that’s a little more impressive visually. When you move the mouse over one of the images on this page, the application fetches text for that mouseover by using Ajax. All you really have to do is to connect the getData function (which fetches text data and displays it in the <div> element whose name you pass) to the ‘onmouseover’ event of each of the images you see in Figure 3-3.
Take a look at this :
    How to do this :
    Here’s the content of sandwiches.txt :      and pizzas.txt :     and soups.txt :
Hm…done with coding 

More Related Content

What's hot

Introduction to Web Programming - first course
Introduction to Web Programming - first courseIntroduction to Web Programming - first course
Introduction to Web Programming - first course
Vlad Posea
 

What's hot (20)

Ajax presentation
Ajax presentationAjax presentation
Ajax presentation
 
Ajax.ppt
Ajax.pptAjax.ppt
Ajax.ppt
 
Javascript
JavascriptJavascript
Javascript
 
Oops concepts in php
Oops concepts in phpOops concepts in php
Oops concepts in php
 
Web server
Web serverWeb server
Web server
 
Introduction to Web Programming - first course
Introduction to Web Programming - first courseIntroduction to Web Programming - first course
Introduction to Web Programming - first course
 
Chap 4 PHP.pdf
Chap 4 PHP.pdfChap 4 PHP.pdf
Chap 4 PHP.pdf
 
jQuery PPT
jQuery PPTjQuery PPT
jQuery PPT
 
Introduction to ajax
Introduction to ajaxIntroduction to ajax
Introduction to ajax
 
HTTP request and response
HTTP request and responseHTTP request and response
HTTP request and response
 
javaScript.ppt
javaScript.pptjavaScript.ppt
javaScript.ppt
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginners
 
Php mysql ppt
Php mysql pptPhp mysql ppt
Php mysql ppt
 
Java Script ppt
Java Script pptJava Script ppt
Java Script ppt
 
What is Ajax technology?
What is Ajax technology?What is Ajax technology?
What is Ajax technology?
 
PHP Cookies and Sessions
PHP Cookies and SessionsPHP Cookies and Sessions
PHP Cookies and Sessions
 
Cookies and sessions
Cookies and sessionsCookies and sessions
Cookies and sessions
 
Express js
Express jsExpress js
Express js
 
Dom(document object model)
Dom(document object model)Dom(document object model)
Dom(document object model)
 
Java Server Pages(jsp)
Java Server Pages(jsp)Java Server Pages(jsp)
Java Server Pages(jsp)
 

Similar to Ajax ppt - 32 slides

Ajax: User Experience
Ajax: User ExperienceAjax: User Experience
Ajax: User Experience
petrov
 
Rob Tweed :: Ajax and the Impact on Caché and Similar Technologies
Rob Tweed :: Ajax and the Impact on Caché and Similar TechnologiesRob Tweed :: Ajax and the Impact on Caché and Similar Technologies
Rob Tweed :: Ajax and the Impact on Caché and Similar Technologies
george.james
 
Java Script - A New Look
Java Script - A New LookJava Script - A New Look
Java Script - A New Look
rumsan
 

Similar to Ajax ppt - 32 slides (20)

Asynchronous javascript and xml
Asynchronous javascript and xmlAsynchronous javascript and xml
Asynchronous javascript and xml
 
Intoduction to Ajax
Intoduction to AjaxIntoduction to Ajax
Intoduction to Ajax
 
Ajax Ppt 1
Ajax Ppt 1Ajax Ppt 1
Ajax Ppt 1
 
25250716 seminar-on-ajax text
25250716 seminar-on-ajax text25250716 seminar-on-ajax text
25250716 seminar-on-ajax text
 
Ajax
AjaxAjax
Ajax
 
Lessons from the Trenches: Engineering Great AJAX Experiences
Lessons from the Trenches: Engineering Great AJAX ExperiencesLessons from the Trenches: Engineering Great AJAX Experiences
Lessons from the Trenches: Engineering Great AJAX Experiences
 
Lessons
LessonsLessons
Lessons
 
Ajax
AjaxAjax
Ajax
 
AJAX
AJAXAJAX
AJAX
 
Ajax & Reverse Ajax Presenation
Ajax & Reverse Ajax PresenationAjax & Reverse Ajax Presenation
Ajax & Reverse Ajax Presenation
 
Ajax
AjaxAjax
Ajax
 
Ajax: User Experience
Ajax: User ExperienceAjax: User Experience
Ajax: User Experience
 
Ajax ppt
Ajax pptAjax ppt
Ajax ppt
 
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
 
01 Ajax Intro
01 Ajax Intro01 Ajax Intro
01 Ajax Intro
 
M Ramya
M RamyaM Ramya
M Ramya
 
Rob Tweed :: Ajax and the Impact on Caché and Similar Technologies
Rob Tweed :: Ajax and the Impact on Caché and Similar TechnologiesRob Tweed :: Ajax and the Impact on Caché and Similar Technologies
Rob Tweed :: Ajax and the Impact on Caché and Similar Technologies
 
Java Script - A New Look
Java Script - A New LookJava Script - A New Look
Java Script - A New Look
 

Recently uploaded

Gardella_Mateo_IntellectualProperty.pdf.
Gardella_Mateo_IntellectualProperty.pdf.Gardella_Mateo_IntellectualProperty.pdf.
Gardella_Mateo_IntellectualProperty.pdf.
MateoGardella
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
kauryashika82
 
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
QucHHunhnh
 
Making and Justifying Mathematical Decisions.pdf
Making and Justifying Mathematical Decisions.pdfMaking and Justifying Mathematical Decisions.pdf
Making and Justifying Mathematical Decisions.pdf
Chris Hunter
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
ciinovamais
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
 

Recently uploaded (20)

Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
Mattingly "AI & Prompt Design: Structured Data, Assistants, & RAG"
 
Advanced Views - Calendar View in Odoo 17
Advanced Views - Calendar View in Odoo 17Advanced Views - Calendar View in Odoo 17
Advanced Views - Calendar View in Odoo 17
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Class 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdfClass 11th Physics NEET formula sheet pdf
Class 11th Physics NEET formula sheet pdf
 
Advance Mobile Application Development class 07
Advance Mobile Application Development class 07Advance Mobile Application Development class 07
Advance Mobile Application Development class 07
 
Gardella_Mateo_IntellectualProperty.pdf.
Gardella_Mateo_IntellectualProperty.pdf.Gardella_Mateo_IntellectualProperty.pdf.
Gardella_Mateo_IntellectualProperty.pdf.
 
fourth grading exam for kindergarten in writing
fourth grading exam for kindergarten in writingfourth grading exam for kindergarten in writing
fourth grading exam for kindergarten in writing
 
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingGrant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy Consulting
 
Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104Nutritional Needs Presentation - HLTH 104
Nutritional Needs Presentation - HLTH 104
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
 
psychiatric nursing HISTORY COLLECTION .docx
psychiatric  nursing HISTORY  COLLECTION  .docxpsychiatric  nursing HISTORY  COLLECTION  .docx
psychiatric nursing HISTORY COLLECTION .docx
 
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across Sectors
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17
 
Making and Justifying Mathematical Decisions.pdf
Making and Justifying Mathematical Decisions.pdfMaking and Justifying Mathematical Decisions.pdf
Making and Justifying Mathematical Decisions.pdf
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdf
 
Web & Social Media Analytics Previous Year Question Paper.pdf
Web & Social Media Analytics Previous Year Question Paper.pdfWeb & Social Media Analytics Previous Year Question Paper.pdf
Web & Social Media Analytics Previous Year Question Paper.pdf
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 

Ajax ppt - 32 slides

  • 1. Welcome to One & AllG d Day Seminar on AJAX
  • 3. Back then : Click Search
  • 4. And you get this :
  • 6. The magic spell behind this is :AJAX
  • 7.
  • 8. A new technology – not exactly…
  • 9. So what else ? It is a methodology on using several web technologies together, in an effort to close the gap between the usability and interactivity of a desktop application and the ever demanding web application 
  • 10. Order of Developments Internet Explorer introduces the concept of IFrame element in 1996.(a technique that helps in loading the contents of a web page.) In the year 1998, Microsoft introduces another technique, called ‘Microsoft’s Remote Scripting’ as a replacement to the older techniques.
  • 11. A year later, in 1999, Microsoft introduces the XMLHttpRequest object, an ActiveX control, in IE 5. The term AJAX is coined on February 18, 2005, by Jesse James Garret in a short essay published a few days after Google released its Maps application.
  • 12. Finally, in the year 2006, the W3C (World Wide Web Consortium) announces the release of the first draft which includes the specification for the object (XHR) and makes it an official web standard.
  • 13.
  • 14. Developers can now provide user interfaces that are nearly as responsive and rich as more traditional Windows Forms applications while taking advantage of the Web's innate ease of deployment and heterogeneous, cross-platform nature.
  • 15. These benefits have been shown to dramatically reduce software maintenance costs and increase its reach. You can use AJAX to load specific portions of a page that need to be changed.
  • 16.
  • 18.
  • 19. A little about XHR object
  • 20.
  • 22. A few status values
  • 23. Let’s get to some work 
  • 26. Output page looks like this :
  • 28. Here comes another Ajax example — one that’s a little more impressive visually. When you move the mouse over one of the images on this page, the application fetches text for that mouseover by using Ajax. All you really have to do is to connect the getData function (which fetches text data and displays it in the <div> element whose name you pass) to the ‘onmouseover’ event of each of the images you see in Figure 3-3.
  • 29. Take a look at this :
  • 30. How to do this :
  • 31. Here’s the content of sandwiches.txt : and pizzas.txt : and soups.txt :
  • 33.  Benefits of using Ajax Helps to build fast, dynamic websites. Improves sharing of resources : it facilitates to use the power of all the client computers rather than just a unique server and network. Ajax allows to perform processing on client computer (in JavaScript) with data taken from the server thereby reducing server load by moving a part of server functionality to client side. Ajax can selectively modify a part of a page displayed by the browser, and update it without the need to reload the whole document with all images, menus etc. This bridges the gap between desktop and web applications.
  • 34.  A Few Drawbacks If JavaScript is not activated, Ajax can't works. The user must be asked to set JavaScript from within options of the browser, with the "noscript" tag. Since data to display are loaded dynamically, they are not part of the page, and the keywords inside are not viewed by search engines. The asynchronous mode may change the page with delays (when the processing on the server takes more time), this may be disturbing. The back button may be deactivated.
  • 36. A presentation by SmithBig thanks to “members of slideshare.net and the website crew”Special thanks toM Ramya, MCA IIIrd yr – member of slideshare.net