Project Plan

So our entrepreneurship team (MGMT 5500) is trying to start-up a website as a marketplace for teachers. We are going to start with selling just lesson plans. I was thinking that I could create a dashboard that teachers could utilize in various categories and customize according to what they are interested in (i.e. what type of lesson plans, maybe books, etc). This would be using more of the DOM. There would be a selling area where you place what you want to sell (i.e. lesson plans) and place your information, etc. (that would use Ajax). Then there would be a cart where you can check-out the things you want to buy (similar to the selling area, that would be using Ajax).

Chap 7

Wow, new blogger with Google sucks. I just finished the chapter 7 summary, but it logged me out after a little and erased all I had written. Here goes to re-summarizing.

This chapter discusses the differences between XML and JSON.

You work with XML using DOM while you work with JSON using "normal" JavaScript. Hence, you don't need a special object mode to work with JSON data.

The easier use JSON helps with is utilizing arrays.

The great thing about JSON is that it's JavaScript, so it uses JSON easily.

The bad thing is that since it's JavaScript, PHP, Perl, and Java can't understand JSON without libraries.

You'll need a new Services_JSON object to handle encoding a JSON response in PHP.

When servers respond with JSON, they send the data across as text. So you need to use the responseText property of request object to get the JSON data. But JSON is meant to be used in JavaScript as an object, so you've got to convert it from text to its object form. You can do this using JavaScript's eval() function.

You can find libraries at www.json.org.

JSON works great with objects, but not all sites need objects. You should use text data for your requests whenever possible.

Ultimately, the choice is yours whether you want to use XML or JSON.

On Friday, I spoke with Dr. Piercy and discussed with him the idea of working on a project related to my entrepreneurship class. We're currently discussing the idea of creating something of a marketplace for teachers to sell and buy lesson plans. I am still trying to figure out how to implement AJAX within this application.

Chap 6 (Cont'd)

XML is a standard, but not necessarily a standard the way it is used. XML is a meta-language: it defines other XML languages. It defines what an element is, what an attribute is, and how things like angle brackets, <>, are supposed to be used.

Sometimes XML is great and sometimes it's not. It takes a lot of text to say just a little in XML. Don't try to use XML for everything.

Because it takes a lot of text for XML, you'll need to use a POST request (because GET might leave out text).

You can use the setRequestHeader() method to tell the server that you're sending XML.

Chap 6

This chapter focuses on XML for requests and responses. XML is about to help web servers say more in their responses.

Next the book revists the Boards 'R' Us website. It's been working well, but now the business has expanded to 3 products and is in need of a way of updating totals from the server for all 3 lines at once.

Page 345 shows the lines of XML that can be returned by the server to the webpage.

The DOM is so versatile that not only does it work with HTML, but it also works with XML.

FYI: As your browser sees your HTML as a DOM tree, web browsers automatically convert XML into DOM trees. You can work with more than one DOM tree in the same JavaScript function. HTML and XML elements are both just element nodes in the DOM. The responseXML property always returns a DOM document object, even if the XML in the DOM tree is only a single element, or just a single text node.

For the Boards 'R' Us page, we can just take the values from the XML DOM and place them in the HTML DOM.

Instead of using getElementByID() for HTML DOM, we can use getElementsByTagName() . This will return an array of all the elements named "boards-sold" in the xmlDoc DOM tree.

The code is: var firstBoardsSoldElement = xmlDoc.getElementsByTagName("boards-sold")[0];

Chap 5 (Cont'd)

Then Project:Chaos begins attempting to break the website through SQL injections.

You should ALWAYS validate user input on your website.

In the process of protecting against SQL injections, they:
1.) Make sure to have a validation-utils.js file
2.) Add a reference to validation-utils.js in the Break Neck web form
3.) Validate the phone number before sending it to the Break Neck web server
4.) Test validation

They also secure the PHP script for the lookupCustomer.php file. The reason for this is because hackers can send a Post request directly to the PHP without using the web form.

There are a couple strings they place in the PHP on page 332.

Chap 5

This chapter seems to focus more on POST by ditching send(null) and sending more data to the server. They're back to working on the Break Neck Pizza site.

First, they update the Break Neck HTML by deleting the method="POST" and action="placeOrder.php" and input type="submit" value="Order Pizza" strings. They also replaced the input type to a button and added the JavaScript function, onClick="submitOrder();". Secondly, they send the order to the server by writing the submitOrder JavaScript function. Third, they update the placeOrder.php file by sending less HTML. Fourth, they are going to write teh callback function to display the delivery estimate to the customer. This is where we see that the DOM is connected to the visuals seen by a customer. After, it's time to test the application.

The book goes into ways of checking for errors, how to use error messages, and error handling in JavaScript. They also describe the differences between Get requests and Post requests.

In Get requests, data is sent in the request URL, while Post requests get sent separate to the request URL. The web servers unencode Post data. Post requests allow you to send more data.

Next, they ask you to test the Post request knowing that it doesn't work. They go through a whole dialog discussing what might be wrong. The solution is that the server needs to know what to expect by setting the context type.

They set the content type in the function submitOrder with the request.setRequestHeader string (p308).

They finally go on about the benefits of using Post versus Get.

Chap 4.5

This chapter is dedicated to writing a Dom-based application. We'll also be learning how to change a node's style, create a user-friendly, dynamic application.

In this chapter, the game plan is to:
1.) Create a new file to store the page's JavaScript code
2.) Write a function that adds a CD to the Top 5 list when the CD's cover is clicked
3.) Add a ranking number to each CD, so users can see the order of the Top 5
4.) Write a function that clears the user's choices and starts over
...while writing a web page for rating the Top 5 blues CDs of all time.

In setting up the CD covers, when someone clicks on a CD cover image, we need the Top 5 page to run our addToTop5() function.
There are two ways to run this:
1.) Add onClick event handlers to every "img" element in top5.html
2.) Use JavaScript to programmatically add event handlers to all "img" elements

Creating an addOnClickHandlers() function will add event handlers to all the "div" elements in the "cds" div.

In order to run the event handlers as soon as the page loads, there is a "" element called onLoad(). This can be used to run a JavaScript function any time the page loads.