Introduction to AJAX MIS 3502 Jeremy Shafer Department of MIS

Slides:



Advertisements
Similar presentations
Copyright © Steven W. Johnson
Advertisements

Introduction to PHP MIS 3501, Fall 2014 Jeremy Shafer
Davis Dai. Introduction  Acronym for “asynchronous JavaScript and XML”  Combination of various technologies  Was not developed as an official standard.
AJAX Presented by: Dickson Fu Dimas Ariawan Niels Andreassen Ryan Dial Jordan Nielson CMPUT 410 University of Alberta 2006.
IS 360 Course Introduction. Slide 2 What you will Learn (1) The role of Web servers and clients How to create HTML, XHTML, and HTML 5 pages suitable for.
Ajax Dr Jim Briggs WEBP Ajax1. 2 Ajax Asynchronous JavaScript And XML Method of creating more interactive web applications Moves more of the application.
AJAX (Asynchronous JavaScript and XML) Amit Jain CS 590 – Winter 2008.
Dynamic Web Pages Bert Wachsmuth. Review  Internet, IP addresses, ports, client-server, http, smtp  HTML, XHTML, XML  Style Sheets, external, internal,
CS 4720 RESTfulness and AJAX CS 4720 – Web & Mobile Systems.
May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Build Great Web Application 'Fast and Easy'
Lecture 12 – AJAX SFDV3011 – Advanced Web Development Reference: 1.
AJAX and Java ISYS 350. AJAX Asynchronous JavaScript and XML: – Related technologies: JavaScript, Document Object Model, XML, server-side script such.
Client side web programming Introduction Jaana Holvikivi, DSc. School of ICT.
Random Logic l Forum.NET l AJAX Behind the buzz word Forum.NET ● January 23, 2006.
Summer 2007 Florida Atlantic University Department of Computer Science & Engineering COP 4814 – Web Services Dr. Roy Levow Part 1 – Introducing Ajax.
CHAPTER 13 COMMUNICATING WITH AJAX. LEARNING OBJECTIVES AJAX, which stands for Asynchronous JavaScript and XMLprovides a way for a browser to send and.
INTRODUCTION JavaScript can make websites more interactive, interesting, and user-friendly.
Event Handling & AJAX IT210 Web Systems. Question How do we enable users to dynamically interact with a website? Answer: Use mouse and keyboard to trigger.
AJAX and REST. Slide 2 What is AJAX? It’s an acronym for Asynchronous JavaScript and XML Although requests need not be asynchronous It’s not really a.
Document Object Model Nasrullah. DOM When a page is loaded,browser creates a Document Object Model of the Page.
AJAX AJAX Asynchronous JavaScript and XML --- MADHAVI
Web Technology (NCS-504) Prepared By Mr. Abhishek Kesharwani Assistant Professor,UCER Naini,Allahabad.
Introduction to JavaScript MIS 3502, Spring 2016 Jeremy Shafer Department of MIS Fox School of Business Temple University 2/2/2016.
Introduction to AJAX MIS 3502, Spring 2016 Jeremy Shafer Department of MIS Fox School of Business Temple University 2/4/2016.
JavaScript and Ajax Week 10 Web site:
National College of Science & Information Technology.
Introduction to JavaScript MIS 3502, Fall 2016 Jeremy Shafer Department of MIS Fox School of Business Temple University 9/29/2016.
Dive into web development
Javascript and Dynamic Web Pages: Client Side Processing
Programming Web Pages with JavaScript
JavaScript and Ajax (Ajax Tutorial)
Not a Language but a series of techniques
AJAX AJAX = Asynchronous JavaScript and XML.
Introduction to web development concepts
AJAX and REST.
Application with Cross-Platform GUI
Asynchronous Java script And XML Technology
AJAX.
Introduction to JavaScript
Introduction to AJAX MIS 3502 Jeremy Shafer Department of MIS
IS 360 Course Introduction
A second look at JavaScript
Ajax and JSON (jQuery part 2)
COP 3813 Intro to Internet Computing
ISC440: Web Programming 2 AJAX
JavaScript & jQuery AJAX.
MySQL Backup, Transfer and Restore
Secure Web Programming
HTML and CSS MIS 2402 Jeremy Shafer Department of MIS
Sending a text message (and more)
JavaScript and the DOM MIS 2402 Jeremy Shafer Department of MIS
Numbers, strings and dates in JavaScript
MIS JavaScript and API Workshop (Part 3)
Introduction to AJAX and JSON
Loops and Arrays in JavaScript
Introduction to World Wide Web
Introduction to JavaScript
An introduction to jQuery
MVC – Model View Controller
Introduction to MIS2402 MIS MIS2402 Jeremy Shafer Department of MIS
An introduction to jQuery
Introduction to AJAX and JSON
Ajax and JSON Jeremy Shafer Department of MIS Fox School of Business
Client-Server Model: Requesting a Web Page
HTML MIS 2402 Jeremy Shafer Department of MIS Fox School of Business
AJAX Chapters 19, 20.
Sending a text message (and more)
Ajax and JSON Jeremy Shafer Department of MIS Fox School of Business
AJAX By Prof. B.A.Khivsara
Presentation transcript:

Introduction to AJAX MIS 3502 Jeremy Shafer Department of MIS Fox School of Business Temple University

URL, referencing a .php page Recall from last time… PHP Interpreter URL, referencing a .php page Browser JavaScript Engine HTTP Response Database As a general rule, JavaScript lives here, in the browser, and does not interact with any resource outside the browser. This is called a “round trip”

The DOM (Document Object Model) JavaScript can change all the HTML elements in the page JavaScript can change all the HTML attributes in the page JavaScript can change all the CSS styles in the page JavaScript can remove existing HTML elements and attributes JavaScript can add new HTML elements and attributes JavaScript can react to all existing HTML events in the page JavaScript can create new HTML events in the page All of these activities are accomplished through the properties and methods of objects. Source: http://www.w3schools.com/js/js_htmldom.asp

So, what’s AJAX? AJAX is short for Asynchronous JavaScript and XML It is the combination of these technologies, not a separate technology in itself It’s kind of sneaky…

AJAX uses JavaScript to call web services PHP Interpreter URL, referencing a .php page Browser JavaScript Engine HTTP Response Database Less of this

AJAX uses JavaScript to call resources PHP Interpreter HTTP Requests Browser JavaScript Engine Database More of this

AJAX uses JavaScript to call resources Let’s take a closer look at JavaScript and the DOM Browser JavaScript Engine

AJAX uses JavaScript to call resources The term "Ajax" was publicly stated on 18 February 2005 by Jesse James Garrett in an article titled "Ajax: A New Approach to Web Applications", based on techniques used on Google pages. This object acts like a browser, inside the browser. XMLHttpRequest()

XMLHttpRequest allows us to do things like this…

XMLHttpRequest allows us to do things like this… Look at the parameter. Is there something to do?

XMLHttpRequest allows us to do things like this… Ah! There *is* something to do

XMLHttpRequest allows us to do things like this… “listen” for the ready state property to change. When it does, execute this function.

XMLHttpRequest allows us to do things like this… This is a function, defined inside of a function. (Pretty crazy, huh?)

XMLHttpRequest allows us to do things like this… Get ready to open a page. Use the GET method. Specify the page. Asynchronous = true.

XMLHttpRequest allows us to do things like this… Go get the page.

It’s time for an experiment!