SlideShare a Scribd company logo
A synchronous J avaScript A nd X ML What? Why? How? Who?
Overview Web applications are based on request/response During request process,  nothing  is displayed
Overview Please wait … Request Response Client Server
Overview: Traditional Web App. Life Cycle Request
Process Overview: Traditional Web App. Life Cycle Loading
Response Overview: Traditional Web App. Life Cycle
Overview To improve performance, you either: load everything & display required data (JavaScript) OR keep moving back and forth between client & server An alternative way is to use AJAX .
What? AJAX: Asynchronous JavaScript And XML AJAX uses a  XML  to send and receive  asynchronous  requests/responses and then leverages presentation technologies ( JavaScript , DOM, HTML, and CSS) to process the response.  Most browsers support the necessary technology for AJAX.
AJAX enables you execute a server-side method through a JavaScript call, without requiring a browser refresh. What?
AJAX Web App. Life Cycle Request
Process AJAX Web App. Life Cycle Nothing here
Response AJAX Web App. Life Cycle
Real world example Falafel & Jumaa
Let us start cooking, I am HUNGRY! Ingredients: JavaScript To build client-side functionality (using DOM). XMLHttpRequest object To enable JS to access the server  asynchronously . Server Side Technology To handle the request. The response will be  XML .
How (how to use AJAX)? Modify web.config Register the web page Use  <Ajax.AjaxMethod()>  attribute Write JavaScript to handle the response
How (how to use AJAX)? Do not just tell me, show me a demo!
Who (who use AJAX)? Windows Live Mail ( http:// www.hotmail.com ) Google Goole Mail ( http:// mail.google.com ) Google Maps ( http:// maps.google.com ) Google Suggests ( http://www.google.com/webhp?complete=1&hl=en ) Yahoo! Flickr ( http://www.flickr.com ) Meebo ( http:// www.meebo.com ) …  Who’s next (you???)
Who (who uses AJAX)?
FAQ What data types does AJAX support? AJAX supports: Primitive types of custom classes and arrays integers, strings, double, booleans, DateTime, DataSets and DataTables All other types have their ToString values returned What about  Session s? AJAX supports Session read and write
Why (why to use AJAX)? Faster web actions Less (or no) page refreshes Reduce network traffic Decreased server-side bandwidth usage Web apps that rival (or surpass) installed GUI apps
Why (why  not  to use AJAX)? Bye bye, bookmarks! Search engines may not be able to index all pages. Inaccurate Back & Forward button actions. JavaScript can be easily disabled from client side.
Do not reinvent the wheel,  Many AJAX frameworks are available now: AJAX.Net Abobe  (Spry). Google  (Google Web Toolkit). Microsoft  (Atlas). …  others are coming.
AJAX.Net Server Side Code [AjaxMethod] public DataSet GetDataSet(){ DataSet ds = new DataSet(); ... return ds; }
AJAX.Net Client Side Code function doTest1(){ AJAXDemo. GetDataSet(_callback1); } function _callback1(res){ var cols = res.value.Tables[0].Columns.length; var rows = res.value.Tables[0].Rows.length; alert(cols + &quot; cols and &quot; + rows + &quot; rows&quot;); }
AJAX.Net Dataset ( Creating a client-side DataSet using JS ) var ds = new Ajax.Web.DataSet(); var dt = new Ajax.Web.DataTable(); dt.addColumn(&quot;FirstName&quot;, &quot;System.String&quot;); dt.addColumn(&quot;Age&quot;, &quot;System.Int32&quot;); dt.addRow({&quot;FirstName&quot;:&quot;Michael&quot;,&quot;Age&quot;:28}); dt.addRow({&quot;FirstName&quot;:&quot;Tanja&quot;,&quot;Age&quot;:25}); ds.addTable(dt);
AJAX.Net Dataset ( Creating a client-side DataSet using JS ) dt.addRow({&quot;FirstName&quot;:&quot;Michael&quot;,&quot;Age&quot;:28}); // or using an object var row = new Object(); row.FirstName = &quot;Michael&quot;; row.Age = 28; dt.addRow(row);
One Day AJAX is not the end, one day you will look at this technology and  LAUGH !!!
Ad

More Related Content

What's hot (20)

Introduction to ajax
Introduction  to  ajaxIntroduction  to  ajax
Introduction to ajax
Pihu Goel
 
Express JS
Express JSExpress JS
Express JS
Alok Guha
 
Ajax ppt - 32 slides
Ajax ppt - 32 slidesAjax ppt - 32 slides
Ajax ppt - 32 slides
Smithss25
 
JavaScript Promises
JavaScript PromisesJavaScript Promises
JavaScript Promises
L&T Technology Services Limited
 
Node.js Express
Node.js  ExpressNode.js  Express
Node.js Express
Eyal Vardi
 
Javascript
JavascriptJavascript
Javascript
Momentum Design Lab
 
Expressjs
ExpressjsExpressjs
Expressjs
Yauheni Nikanovich
 
NodeJS - Server Side JS
NodeJS - Server Side JS NodeJS - Server Side JS
NodeJS - Server Side JS
Ganesh Kondal
 
jQuery Ajax
jQuery AjaxjQuery Ajax
jQuery Ajax
Anand Kumar Rajana
 
JQuery introduction
JQuery introductionJQuery introduction
JQuery introduction
NexThoughts Technologies
 
Jsp
JspJsp
Jsp
Khan Mac-arther
 
Soap vs rest
Soap vs restSoap vs rest
Soap vs rest
Antonio Severien
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginners
Arulmurugan Rajaraman
 
Object Oriented Programming In JavaScript
Object Oriented Programming In JavaScriptObject Oriented Programming In JavaScript
Object Oriented Programming In JavaScript
Forziatech
 
JavaScript - Chapter 13 - Browser Object Model(BOM)
JavaScript - Chapter 13 - Browser Object Model(BOM)JavaScript - Chapter 13 - Browser Object Model(BOM)
JavaScript - Chapter 13 - Browser Object Model(BOM)
WebStackAcademy
 
Introduction to ReactJS
Introduction to ReactJSIntroduction to ReactJS
Introduction to ReactJS
Knoldus Inc.
 
Java script ppt
Java script pptJava script ppt
Java script ppt
The Health and Social Care Information Centre
 
reactJS
reactJSreactJS
reactJS
Syam Santhosh
 
Hibernate Presentation
Hibernate  PresentationHibernate  Presentation
Hibernate Presentation
guest11106b
 
Hibernate ppt
Hibernate pptHibernate ppt
Hibernate ppt
Aneega
 

Viewers also liked (20)

Ajax Ppt
Ajax PptAjax Ppt
Ajax Ppt
Hema Prasanth
 
Introduction to ajax
Introduction to ajaxIntroduction to ajax
Introduction to ajax
Nir Elbaz
 
Ajax for dummies, and not only.
Ajax for dummies, and not only.Ajax for dummies, and not only.
Ajax for dummies, and not only.
Nerd Tzanetopoulos
 
Ajax Introduction Presentation
Ajax   Introduction   PresentationAjax   Introduction   Presentation
Ajax Introduction Presentation
thinkphp
 
Ajax Ppt 1
Ajax Ppt 1Ajax Ppt 1
Ajax Ppt 1
JayaPrakash.m
 
An Introduction to Ajax Programming
An Introduction to Ajax ProgrammingAn Introduction to Ajax Programming
An Introduction to Ajax Programming
hchen1
 
основы Ajax презентация
основы Ajax   презентацияосновы Ajax   презентация
основы Ajax презентация
sivorka
 
Overview of AJAX
Overview of AJAXOverview of AJAX
Overview of AJAX
Roshith S Pai
 
Ajax - Presente e futuro delle applicazioni web
Ajax - Presente e futuro delle applicazioni webAjax - Presente e futuro delle applicazioni web
Ajax - Presente e futuro delle applicazioni web
Dominopoint - Italian Lotus User Group
 
Arpanet
ArpanetArpanet
Arpanet
talozumba
 
Corso base di Tecnologie WEB - una visione d'insieme
Corso base di Tecnologie WEB - una visione d'insiemeCorso base di Tecnologie WEB - una visione d'insieme
Corso base di Tecnologie WEB - una visione d'insieme
Studiabo
 
Business consultants what they do and how important are they
Business consultants  what they do and how important are theyBusiness consultants  what they do and how important are they
Business consultants what they do and how important are they
Cooperative Computing
 
Deber 1
Deber 1Deber 1
Deber 1
Cand Jof
 
youthpass_Jakub2015
youthpass_Jakub2015youthpass_Jakub2015
youthpass_Jakub2015
Jakub Pajan
 
ESL Update for Principals 12/11/12
ESL Update for Principals 12/11/12ESL Update for Principals 12/11/12
ESL Update for Principals 12/11/12
Eric Lech
 
Arpanet
ArpanetArpanet
Arpanet
jeremygc99
 
Guerrilla rural del ERP
Guerrilla rural del ERPGuerrilla rural del ERP
Guerrilla rural del ERP
Nicolás Barroso
 
MLM Portfolio
MLM PortfolioMLM Portfolio
MLM Portfolio
Mark McIntire
 
Introduction to HTML5 Canvas
Introduction to HTML5 CanvasIntroduction to HTML5 Canvas
Introduction to HTML5 Canvas
Mindy McAdams
 
Animación3°2 aracelif
Animación3°2 aracelifAnimación3°2 aracelif
Animación3°2 aracelif
Araceli F García
 
Introduction to ajax
Introduction to ajaxIntroduction to ajax
Introduction to ajax
Nir Elbaz
 
Ajax for dummies, and not only.
Ajax for dummies, and not only.Ajax for dummies, and not only.
Ajax for dummies, and not only.
Nerd Tzanetopoulos
 
Ajax Introduction Presentation
Ajax   Introduction   PresentationAjax   Introduction   Presentation
Ajax Introduction Presentation
thinkphp
 
An Introduction to Ajax Programming
An Introduction to Ajax ProgrammingAn Introduction to Ajax Programming
An Introduction to Ajax Programming
hchen1
 
основы Ajax презентация
основы Ajax   презентацияосновы Ajax   презентация
основы Ajax презентация
sivorka
 
Corso base di Tecnologie WEB - una visione d'insieme
Corso base di Tecnologie WEB - una visione d'insiemeCorso base di Tecnologie WEB - una visione d'insieme
Corso base di Tecnologie WEB - una visione d'insieme
Studiabo
 
Business consultants what they do and how important are they
Business consultants  what they do and how important are theyBusiness consultants  what they do and how important are they
Business consultants what they do and how important are they
Cooperative Computing
 
youthpass_Jakub2015
youthpass_Jakub2015youthpass_Jakub2015
youthpass_Jakub2015
Jakub Pajan
 
ESL Update for Principals 12/11/12
ESL Update for Principals 12/11/12ESL Update for Principals 12/11/12
ESL Update for Principals 12/11/12
Eric Lech
 
Introduction to HTML5 Canvas
Introduction to HTML5 CanvasIntroduction to HTML5 Canvas
Introduction to HTML5 Canvas
Mindy McAdams
 
Ad

Similar to Ajax Presentation (20)

Ajax3
Ajax3Ajax3
Ajax3
Brian Moschel
 
Ajax: User Experience
Ajax: User ExperienceAjax: User Experience
Ajax: User Experience
petrov
 
Copy of ajax tutorial
Copy of ajax tutorialCopy of ajax tutorial
Copy of ajax tutorial
Abhishek Kesharwani
 
Introduction to ajax
Introduction to ajaxIntroduction to ajax
Introduction to ajax
Venkat Pinagadi
 
Using Ajax In Domino Web Applications
Using Ajax In Domino Web ApplicationsUsing Ajax In Domino Web Applications
Using Ajax In Domino Web Applications
dominion
 
Ajax
AjaxAjax
Ajax
Shivam Jaiswal
 
Ajax
AjaxAjax
Ajax
TSUBHASHRI
 
M Ramya
M RamyaM Ramya
M Ramya
st anns PG College,Mallapur,Hyderabad, India
 
AJAX
AJAXAJAX
AJAX
Abhilasha Lahigude
 
01 Ajax Intro
01 Ajax Intro01 Ajax Intro
01 Ajax Intro
Dennis Pipper
 
Ajax Introduction
Ajax IntroductionAjax Introduction
Ajax Introduction
Oliver Cai
 
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
 
Ajax
Ajax Ajax
Ajax
ahmedfaragmostafa
 
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
Marcos Caceres
 
Ajax
AjaxAjax
Ajax
guest873a50
 
mukesh
mukeshmukesh
mukesh
guest06dc4b2
 
Ajax Introduction
Ajax IntroductionAjax Introduction
Ajax Introduction
bansalpriyankachd
 
Ajax
AjaxAjax
Ajax
rahmed_sct
 
Ajax and PHP
Ajax and PHPAjax and PHP
Ajax and PHP
John Coggeshall
 
25250716 seminar-on-ajax text
25250716 seminar-on-ajax text25250716 seminar-on-ajax text
25250716 seminar-on-ajax text
Kamleshh Chandnani
 
Ad

Recently uploaded (20)

Cybersecurity Identity and Access Solutions using Azure AD
Cybersecurity Identity and Access Solutions using Azure ADCybersecurity Identity and Access Solutions using Azure AD
Cybersecurity Identity and Access Solutions using Azure AD
VICTOR MAESTRE RAMIREZ
 
How analogue intelligence complements AI
How analogue intelligence complements AIHow analogue intelligence complements AI
How analogue intelligence complements AI
Paul Rowe
 
UiPath Community Berlin: Orchestrator API, Swagger, and Test Manager API
UiPath Community Berlin: Orchestrator API, Swagger, and Test Manager APIUiPath Community Berlin: Orchestrator API, Swagger, and Test Manager API
UiPath Community Berlin: Orchestrator API, Swagger, and Test Manager API
UiPathCommunity
 
HCL Nomad Web – Best Practices und Verwaltung von Multiuser-Umgebungen
HCL Nomad Web – Best Practices und Verwaltung von Multiuser-UmgebungenHCL Nomad Web – Best Practices und Verwaltung von Multiuser-Umgebungen
HCL Nomad Web – Best Practices und Verwaltung von Multiuser-Umgebungen
panagenda
 
Quantum Computing Quick Research Guide by Arthur Morgan
Quantum Computing Quick Research Guide by Arthur MorganQuantum Computing Quick Research Guide by Arthur Morgan
Quantum Computing Quick Research Guide by Arthur Morgan
Arthur Morgan
 
Technology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data AnalyticsTechnology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data Analytics
InData Labs
 
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdfThe Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
Abi john
 
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc
 
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath MaestroDev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
UiPathCommunity
 
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptxSpecial Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
shyamraj55
 
Designing Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep Dive
Designing Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep DiveDesigning Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep Dive
Designing Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep Dive
ScyllaDB
 
IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...
IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...
IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...
organizerofv
 
DevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptx
DevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptxDevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptx
DevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptx
Justin Reock
 
Splunk Security Update | Public Sector Summit Germany 2025
Splunk Security Update | Public Sector Summit Germany 2025Splunk Security Update | Public Sector Summit Germany 2025
Splunk Security Update | Public Sector Summit Germany 2025
Splunk
 
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Impelsys Inc.
 
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdfComplete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Software Company
 
tecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdftecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdf
fjgm517
 
Linux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdfLinux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdf
RHCSA Guru
 
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes
 
Role of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered ManufacturingRole of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered Manufacturing
Andrew Leo
 
Cybersecurity Identity and Access Solutions using Azure AD
Cybersecurity Identity and Access Solutions using Azure ADCybersecurity Identity and Access Solutions using Azure AD
Cybersecurity Identity and Access Solutions using Azure AD
VICTOR MAESTRE RAMIREZ
 
How analogue intelligence complements AI
How analogue intelligence complements AIHow analogue intelligence complements AI
How analogue intelligence complements AI
Paul Rowe
 
UiPath Community Berlin: Orchestrator API, Swagger, and Test Manager API
UiPath Community Berlin: Orchestrator API, Swagger, and Test Manager APIUiPath Community Berlin: Orchestrator API, Swagger, and Test Manager API
UiPath Community Berlin: Orchestrator API, Swagger, and Test Manager API
UiPathCommunity
 
HCL Nomad Web – Best Practices und Verwaltung von Multiuser-Umgebungen
HCL Nomad Web – Best Practices und Verwaltung von Multiuser-UmgebungenHCL Nomad Web – Best Practices und Verwaltung von Multiuser-Umgebungen
HCL Nomad Web – Best Practices und Verwaltung von Multiuser-Umgebungen
panagenda
 
Quantum Computing Quick Research Guide by Arthur Morgan
Quantum Computing Quick Research Guide by Arthur MorganQuantum Computing Quick Research Guide by Arthur Morgan
Quantum Computing Quick Research Guide by Arthur Morgan
Arthur Morgan
 
Technology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data AnalyticsTechnology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data Analytics
InData Labs
 
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdfThe Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
Abi john
 
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc
 
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath MaestroDev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
UiPathCommunity
 
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptxSpecial Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
shyamraj55
 
Designing Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep Dive
Designing Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep DiveDesigning Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep Dive
Designing Low-Latency Systems with Rust and ScyllaDB: An Architectural Deep Dive
ScyllaDB
 
IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...
IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...
IEDM 2024 Tutorial2_Advances in CMOS Technologies and Future Directions for C...
organizerofv
 
DevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptx
DevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptxDevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptx
DevOpsDays Atlanta 2025 - Building 10x Development Organizations.pptx
Justin Reock
 
Splunk Security Update | Public Sector Summit Germany 2025
Splunk Security Update | Public Sector Summit Germany 2025Splunk Security Update | Public Sector Summit Germany 2025
Splunk Security Update | Public Sector Summit Germany 2025
Splunk
 
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Enhancing ICU Intelligence: How Our Functional Testing Enabled a Healthcare I...
Impelsys Inc.
 
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdfComplete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Software Company
 
tecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdftecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdf
fjgm517
 
Linux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdfLinux Professional Institute LPIC-1 Exam.pdf
Linux Professional Institute LPIC-1 Exam.pdf
RHCSA Guru
 
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes Partner Innovation Updates for May 2025
ThousandEyes
 
Role of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered ManufacturingRole of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered Manufacturing
Andrew Leo
 

Ajax Presentation

  • 1. A synchronous J avaScript A nd X ML What? Why? How? Who?
  • 2. Overview Web applications are based on request/response During request process, nothing is displayed
  • 3. Overview Please wait … Request Response Client Server
  • 4. Overview: Traditional Web App. Life Cycle Request
  • 5. Process Overview: Traditional Web App. Life Cycle Loading
  • 6. Response Overview: Traditional Web App. Life Cycle
  • 7. Overview To improve performance, you either: load everything & display required data (JavaScript) OR keep moving back and forth between client & server An alternative way is to use AJAX .
  • 8. What? AJAX: Asynchronous JavaScript And XML AJAX uses a XML to send and receive asynchronous requests/responses and then leverages presentation technologies ( JavaScript , DOM, HTML, and CSS) to process the response. Most browsers support the necessary technology for AJAX.
  • 9. AJAX enables you execute a server-side method through a JavaScript call, without requiring a browser refresh. What?
  • 10. AJAX Web App. Life Cycle Request
  • 11. Process AJAX Web App. Life Cycle Nothing here
  • 12. Response AJAX Web App. Life Cycle
  • 13. Real world example Falafel & Jumaa
  • 14. Let us start cooking, I am HUNGRY! Ingredients: JavaScript To build client-side functionality (using DOM). XMLHttpRequest object To enable JS to access the server asynchronously . Server Side Technology To handle the request. The response will be XML .
  • 15. How (how to use AJAX)? Modify web.config Register the web page Use <Ajax.AjaxMethod()> attribute Write JavaScript to handle the response
  • 16. How (how to use AJAX)? Do not just tell me, show me a demo!
  • 17. Who (who use AJAX)? Windows Live Mail ( http:// www.hotmail.com ) Google Goole Mail ( http:// mail.google.com ) Google Maps ( http:// maps.google.com ) Google Suggests ( http://www.google.com/webhp?complete=1&hl=en ) Yahoo! Flickr ( http://www.flickr.com ) Meebo ( http:// www.meebo.com ) … Who’s next (you???)
  • 18. Who (who uses AJAX)?
  • 19. FAQ What data types does AJAX support? AJAX supports: Primitive types of custom classes and arrays integers, strings, double, booleans, DateTime, DataSets and DataTables All other types have their ToString values returned What about Session s? AJAX supports Session read and write
  • 20. Why (why to use AJAX)? Faster web actions Less (or no) page refreshes Reduce network traffic Decreased server-side bandwidth usage Web apps that rival (or surpass) installed GUI apps
  • 21. Why (why not to use AJAX)? Bye bye, bookmarks! Search engines may not be able to index all pages. Inaccurate Back & Forward button actions. JavaScript can be easily disabled from client side.
  • 22. Do not reinvent the wheel, Many AJAX frameworks are available now: AJAX.Net Abobe (Spry). Google (Google Web Toolkit). Microsoft (Atlas). … others are coming.
  • 23. AJAX.Net Server Side Code [AjaxMethod] public DataSet GetDataSet(){ DataSet ds = new DataSet(); ... return ds; }
  • 24. AJAX.Net Client Side Code function doTest1(){ AJAXDemo. GetDataSet(_callback1); } function _callback1(res){ var cols = res.value.Tables[0].Columns.length; var rows = res.value.Tables[0].Rows.length; alert(cols + &quot; cols and &quot; + rows + &quot; rows&quot;); }
  • 25. AJAX.Net Dataset ( Creating a client-side DataSet using JS ) var ds = new Ajax.Web.DataSet(); var dt = new Ajax.Web.DataTable(); dt.addColumn(&quot;FirstName&quot;, &quot;System.String&quot;); dt.addColumn(&quot;Age&quot;, &quot;System.Int32&quot;); dt.addRow({&quot;FirstName&quot;:&quot;Michael&quot;,&quot;Age&quot;:28}); dt.addRow({&quot;FirstName&quot;:&quot;Tanja&quot;,&quot;Age&quot;:25}); ds.addTable(dt);
  • 26. AJAX.Net Dataset ( Creating a client-side DataSet using JS ) dt.addRow({&quot;FirstName&quot;:&quot;Michael&quot;,&quot;Age&quot;:28}); // or using an object var row = new Object(); row.FirstName = &quot;Michael&quot;; row.Age = 28; dt.addRow(row);
  • 27. One Day AJAX is not the end, one day you will look at this technology and LAUGH !!!