CSD 340 (Blum)1 Making and Reading from XML Files Chapter 14 of Beginning JavaScript (Paul Wilton)

Slides:



Advertisements
Similar presentations
Working with Forms. how are forms manipulated? the document object contains an array of forms objects, one for each form, in document order –forms[] any.
Advertisements

Review! This is for your test, so pay attention!.
Using the Jumble Word Template
CSD 340 (Blum)1 Using Microsoft Visual Studio.NET Development Environment and Introducing Functions.
Computer Science 103 Chapter 4 Advanced JavaScript.
JavaScript with Input & Output Step 1: Use tags JavaScript Template.
Chapter 12 Creating and Using XML Documents HTML5 AND CSS Seventh Edition.
Lecture 3 – Data Storage with XML+AJAX and MySQL+socket.io
1 CIS336 Website design, implementation and management (also Semester 2 of CIS219, CIS221 and IT226) Lecture 9 JavaServer Pages (JSP) (Based on Møller.
Learning & Development Telerik Software Academy.
JavaScript Defined DOM (Document Object Model) General Syntax Body vs. Head Variables Math & Logic Selection Functions & Events Loops Animation Getting.
XSLT for Data Manipulation By: April Fleming. What We Will Cover The What, Why, When, and How of XSLT What tools you will need to get started A sample.
XP New Perspectives on XML, 2 nd Edition Tutorial 10 1 WORKING WITH THE DOCUMENT OBJECT MODEL TUTORIAL 10.
Client Scripting1 Internet Systems Design. Client Scripting2 n “A scripting language is a programming language that is used to manipulate, customize,
CIS 375—Web App Dev II DOM. 2 Introduction to DOM The XML Document ________ Model (DOM) is a programming interface for XML documents. It defines the way.
XMLHttpRequest Object When Microsoft Internet Explorer 5.0 introduced a rudimentary level of XML support, an ActiveX library called MSXML was also introduced,
Parsing with DOM using MSXML Kanda Runapongsa Dept. of Computer Engineering Khon Kaen University.
Using Visual Basic ® With The MSXML Parser Ken Spencer Vice President 32X Corporation
 2004 Prentice Hall, Inc. All rights reserved. 1 Chapter 34 - Case Study: Active Server Pages and XML Outline 34.1 Introduction 34.2 Setup and Message.
1 Dr Alexiei Dingli XML Technologies XML Advanced.
Utilizing XML in ColdFusion MX by Attila Domokos.
© 2006the University of Greenwich 1 XML 4 DOM and SAX Kevin McManus Recycled from Gill Windall’s notes.
CSD 340 (Blum)1 Ifs. CSD 340 (Blum)2 Page that asks user for background color and changes fore color from black if user selects black as background color.
XML Document Object Model Anthony Borquez. The Document Object Model a programming interface for HTML and XML documents. It defines the way a document.
McGraw-Hill/Irwin © 2004 by The McGraw-Hill Companies, Inc. All rights reserved. Scripting with the DOM Ellen Pearlman Eileen Mullin Programming the Web.
1 Introduction  Extensible Markup Language (XML) –Uses tags to describe the structure of a document –Simplifies the process of sharing information –Extensible.
AJAX (also known as: XMLHTTP, Remote Scripting, XMLHttpRequest, etc.) Matt Warden.
Introduction to Client Side Scripting CS Client Side Scripting Client side means the Browser is interpreting the script Script is downloaded with.
Lecture 9: AJAX, Javascript review..  AJAX  Synchronous vs. asynchronous browsing.  Refreshing only “part of a page” from a URL.  Frameworks: Prototype,
CSD 340 (Blum)1 Using Visual Studio CSD 340 (Blum)2 Start/Microsoft Visual Studio 2005/Microsoft Visual Studio 2005.
DOM Animation Changing the DOM objects over time.
pop_up_windows // ALL STATEMENTS AFTER THE // ARE COMMENTS AND CAN BE REMOVED
CSD 340 (Blum)1 Starting JavaScript Homage to the Homage to the Square.
Chapter 2: Variables, Functions, Objects, and Events JavaScript - Introductory.
CSD 340 (Blum)1 Drop-down list and timers. CSD 340 (Blum)2 Double click on the drop-down list icon to place one on the page.
CSD 340 (Blum)1 Arrays See Beginning JavaScript pp
XML Parser using JavaScript. 2 Microsoft To manipulate an XML document in javascript, you need an XML parser. Today all browsers come with in-built parsers.
CSD 340 (Blum)1 Starting JavaScript Homage to the Homage to the Square.
Lesson 16. Practical Application 1 We can take advantage of JavaScript and the DOM, to set up a form so that the first text box of a form automatically.
IS2802 Introduction to Multimedia Applications for Business Lecture 4: JavaScript, Loops, and Conditional Statements Rob Gleasure
CSD 340 (Blum)1 Errors and Debugging and Swapping Variable Values.
CHAPTER 8 AJAX & JSON WHAT IS AJAX? Ajax lets you…
Dave Salinas. What is XML? XML stands for eXtensible Markup Language Markup language, like HTML HTML was designed to display data, whereas XML was designed.
CSD 340 (Blum)1 Arrays See Beginning JavaScript pp
AJAX AJAX Asynchronous JavaScript and XML --- MADHAVI
CSD 340 (Blum)1 For Loops See Beginning JavaScript (Paul Wilton) p. 87.
Radio Buttons. Input/Form/Radio Group Use the dialog to enter label and values for the radio buttons.
Document Object Model.  The XML DOM (Document Object Model) defines a standard way for accessing and manipulating XML documents.  The DOM presents an.
AJAX – Asynchronous JavaScript And XML By Kranthi Kiran Nuthi CIS 764 Kansas State University.
CSD 340 (Blum)1 Introducing Text Input elements and Ifs.
XML DOM Week 11 Web site:
XML & JSON. Background XML and JSON are to standard, textual data formats for representing arbitrary data – XML stands for “eXtensible Markup Language”
JQuery, JSON, AJAX. AJAX: Async JavaScript & XML In traditional Web coding, to get information from a database or a file on the server –make an HTML form.
Client-side (JavaScript) Validation. Associating a function with a click event – Part 1 Use the input tag’s onclick attribute to associate a function.
In this session, you will learn to:
Muybridge Lab CSD 340 (Blum).
Introduction to For Loops
Week 11 Web site: XML DOM Week 11 Web site:
Introduction to Client-Side programming using JavaScript
Files and Parsing CSC 265 (Blum).
Fonts, TabControl, ListBox
I dragged over the label tool (A icon) and put it on the form.
How to Create a Microsoft Access 2007 Database
Select tags CSD 340 (Blum).
For this assignment, copy and past the XHTML to a notepad file with the .html extension. Then add the code I ask for to complete the problems.
Classes CSC 265 (Blum).
Web Programming and Design
Web Programming and Design
Web Programming and Design
Presentation transcript:

CSD 340 (Blum)1 Making and Reading from XML Files Chapter 14 of Beginning JavaScript (Paul Wilton)

CSD 340 (Blum)2 File/New/File

CSD 340 (Blum)3 Choose an XML File template and click Open

CSD 340 (Blum)4 Start of XML File

CSD 340 (Blum)5 Design tags and enter data.

CSD 340 (Blum)6 In the Data view

CSD 340 (Blum)7 Save file.

CSD 340 (Blum)8 Saving File

CSD 340 (Blum)9 Enter more data and save

CSD 340 (Blum)10 State Capital Quiz design

CSD 340 (Blum)11 Code for reading XML file for State data and initializing arrays

CSD 340 (Blum)12 Declare and instantiate arrays for state names and capitals var QUIZ_SIZE=5; var MyStateName = new Array(50); var MyStateCapital = new Array(50);

CSD 340 (Blum)13 //loads data from xml file into the arrays (IE only) function LoadStateArray() { var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async = false; xmlDoc.load("States.xml"); Declare and instantiate and ActiveX that can parse an XML file. Setting the async property to false means that the code has to wait for a response. Since the next line of code is about loading the xml file, that is what we are waiting for. Load the XML file.

CSD 340 (Blum)14 Webopedia definition of ActiveX

CSD 340 (Blum)15 Webopedia definition of asynchronous

CSD 340 (Blum)16 for(i=0; i< xmlDoc.getElementsByTagName("state").length; i++) { MyStateName[i] = xmlDoc.getElementsByTagName("state")[i].getElementsByTagNam e("stateName")[0].firstChild.nodeValue; MyStateCapital[i] = xmlDoc.getElementsByTagName("state")[i].getElementsByTagNam e("stateCapital")[0].firstChild.nodeValue; } //end of for loop } //end of function Loop through the “state” elements. Initialize the elements of the arrays from the data in the XML file.

CSD 340 (Blum)17 Whatis definition of tree

CSD 340 (Blum)18 References Beginning JavaScript, Paul Wilton