MIS 3371 Parks Exam 2 Summer 2014 Answers

National Retailer Federation's Top 100 Retailers 2013


1. (50 points) The button to the left executes a javascript function named p1. Assume that when executed, p1 retrieves the data in the textarea to the left, creates the XML DOM object named root and loads the XML data (i.e., don't write the code to retrieve and store the data in root). Each of the 100 retailer tags contain the following nine tags:

     1. rank -- the retailer rank (from 1 to 100)
     2. company -- the name of the company
     3. hq -- location of the company headquarters
     4. ussales -- total sales for 2012
     5. growth -- % sales growth from 2011 to 2012
     6. worldsales -- world wide sales
     7. pcw -- % of world sales in the USA
     8. stores -- total number of store locations
     9. sgrowth -- % growth in store from 2011 to 2012

Write the code for p1 that:

1. produces a 100 row, 9 column table containing the XML data (DO NOT make a heading row).
2. for any row where headquarters (hq) contains the string "Texas", make the entire row have
   a "LightBlue" background color
   (use the style attribute style="background-color:LightBlue;" for the row tag)
3. place the resulting table in the DIV block with id="p1_out"
4. after the table show the average sales growth (growth) for the 100 retailers
   CAUTION:
   Remove the "%" character from the growth text before performing arithmetic with the data.

NOTE: the number of retailers is: root.childNodes.length
NOTE: the nine retailer's tag values are: root.childNodes[i].childnodes[j].text
            where j varies from 0 to 8 (or zero to root.childNodes[i].length)

Assume root's data has already been loaded from the textarea. Show NO heading in the table.

Show NO HTML. Write the javascript for p1 only.


2. (50 points) A user wishes to create a bracket diagram for recording a soccer tournament result thats shows the country name and country flag. There are 8 international teams to be chosen from 238 countries. A DIV block with id="p2x" is shown to the left with a background image that has the bracket diagram and titles. Eight HTML SELECTs are shown below. The first option in each SELECT is "Select a country name" and has value="XX". The remaining options (from 1 to 238) are country names (e.g., "BELGIUM"). Each option has a two-character value attribute that is the country code (e.g., "BE"). The SELECTs have id values: "s0","s2",..."s7". There is an array named cn that contains the 238 country names in element 1 through 238 and there is an array named cc that contains the 238 two character county codes in element 1 through 238 (see below).
Here are the eight SELECTs with selections already made:







There is a button labelled "Execute p2". When clicked, the javascript function p2 creates 8 SPAN blocks inside a loop where i ranges from 0 → 7. In this loop:
1. get the value of selectedIndex for each SELECT
     (i.e., document.getElementById("s"+i.toString()).selectedIndex).
     Call this value temp.
2. create a SPAN block. The first SPAN attributes are:
     style="position:absolute;left:5px;font-size:10px;top:46px;".
     The remaining 7 top values are each increased by 40 pixels
3. inside the each SPAN block place:
     a flag image made with the country code like this: "<img src="+cc[temp]+".gif>"
     followed by a blank space and then the country name: cn[temp]
Then, place the string of eight SPAN blocks in the DIV with id="p2x".
EXPLANATORY NOTES: The following two arrays are defined for you in p2. They both have 239 elements:
     var cn = new Array("Select a Country Name","AALAND ISLANDS","AFGHANISTAN", ... ,"ZAMBIA","ZIMBABWE");
     var cc = new Array("XX","AX","AF", ... ,"ZM","ZW");
The 1st array above is used to: (a) make the 239 options for each of the 8 SELECTs (this has already been done); AND (b) provides the country name for the output (you do this).
The 2nd array above is used to: (a) make the value attribute for each option (this has already been done); AND (b) provides the image SRC attribute for the flags (you do this).
For example in the SELECT, the Afghanistan option is: <option value="AF">AFGHANISTAN
For example in the output, Afghanistan's flag image would be: <img src="AF.gif">, which would be followed by a blank and the country name.
Show NO HTML. Show only the javascript for p2
This is p1_out for problem #1