AJAX

What is AJAX
  • Update a web page without reloading the page
  • Request data from a server - after the page has loaded
  • Receive data from a server - after the page has loaded
  • Send data to a server - in the background

AJAX = Asynchronous JavaScript And XML.
AJAX is not a programming language.
AJAX just uses a combination of:
  • A browser built-in XMLHttpRequest object (to request data from a web server)
  • JavaScript and HTML DOM (to display or use the data)
AJAX is a misleading name. AJAX applications might use XML to transport data, but it is equally common to transport data as plain text or JSON text.
AJAX allows web pages to be updated asynchronously by exchanging data with a web server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.

How AJAX Works

AJAX
  • 1. An event occurs in a web page (the page is loaded, a button is clicked)
  • 2. An XMLHttpRequest object is created by JavaScript
  • 3. The XMLHttpRequest object sends a request to a web server
  • 4. The server processes the request
  • 5. The server sends a response back to the web page
  • 6. The response is read by JavaScript
  • 7. Proper action (like page update) is performed by JavaScript

What is AJAX?

AJAX = Asynchronous JavaScript and XML.
In short; AJAX is about loading data in the background and display it on the webpage, without reloading the whole page.
Examples of applications using AJAX: Gmail, Google Maps, Youtube, and Facebook tabs.


What About jQuery and AJAX?

jQuery provides several methods for AJAX functionality.
With the jQuery AJAX methods, you can request text, HTML, XML, or JSON from a remote server using both HTTP Get and HTTP Post - And you can load the external data directly into the selected HTML elements of your web page!
Without jQuery, AJAX coding can be a bit tricky!

Writing regular AJAX code can be a bit tricky, because different browsers have different syntax for AJAX implementation. This means that you will have to write extra code to test for different browsers. However, the jQuery team has taken care of this for us, so that we can write AJAX functionality with only one single line of code.

jQuery AJAX Methods

In the next chapters we will look at the most important jQuery AJAX methods.


Comments

Post a Comment

Popular posts from this blog

How to build a Wall Mounted Family Calendar and Dashboard

Image
  How to build a Wall Mounted Family Calendar and Dashboard with a Raspberry Pi and cheap monitor Sponsored By I love dashboards. I love Raspberry Pis (tiny $35 computers the size of a set of playing cards). And I'm   cheap   frugal. I found a 24" old LCD at Goodwill (a local thrift shop) and bought it but it's been sitting unused in my garage. Then I stumbled on  DakBoard . The idea is simple - A wifi connected wall display for your photos, calendar, news, weather and to-do. The implementation is simple genius. It's a browser that starts up full screen (kiosk mode) and just sits there and updates occasionally. DakBoard provides the private webpage and tools to make that happen. You can certainly build this yourself with any number of open source tools. I chose  DakBoard  because it was simple, beautiful, and I was able to get the whole thing done in less than an hour. I'm sure I'll spend many hours tweaking it through. There's also the very popular  MagicM
Read more

built web-app Authentication in React Applications

Image
Authentication using an email address before that we setup our react environment                    We can install these packages by typing                npm install --save bcrypt jsonwebtoken mongoose passport passport-local bcrypt                -- algorithm implementation for hashing passwords jsonwebtoken   -- JSON Web Token standard mongoose       --  MongoDB ORM library passport            --flexible authentication library passport-local   --Passport strategy for authenticating with an email and a password and we create a root folder structure like this   install the package.json           -------  by typing/ npm init After the installation of new packages my package.json looked like this:          { "name" : "authentication-in-react-apps" , "version" : "1.0.0" , "description" : "Authentication in React Applications" , "main" : "index.js" , "
Read more

Secure, Simple and Scalable Video Conferencing with Jitsi

Image
  Secure, Simple and Scalable Video Conferencing with Jitsi The situation with COVID-19 affects not only the private lives of people and their families but also the business, excluding the possibility of face-to-face communication. Many individuals and companies are forced to adapt to work and communicate remotely. Thus video conferencing got a high-level demand. One of the key players in this market is Zoom video conferencing software. However, there are multiple claims regarding  Zoom security , confidentiality and data privacy. As a result, people are looking for alternatives that can be privately hosted. That’s why  Jitsi Meet  open source video conferencing tool is gaining more and more popularity, as it can be installed at the preferred local cloud provider or on-premise. Why Jitsi? The key advantages of using Jitsi video conferencing: Open-source solution provided for free and with a wide community support Installation in one click and easy setup User-friendly process of arrangi
Read more