1. PHP ARRAY AND HTML TABLE IST 210 Organization of Data IST210 1

2. 2 1. Title should be your name 2. Background has color yellow 3. Welcome line in heading 4. Your name in bold 5. Major in color red 6. Year in font Arial 7. Hobby in color blue, font Arial, and italic 8. Access it from the web

3. IST210 3 Heading 1 Font of the number: color red, size 5 Font of the number: color green, size 5 Font: color green in heading 1,2,3 Repeat 3 times (because your number is the same as the lucky number- you win- and 3 is the your random number)

4. Tips in Debugging What’s wrong with my code? IST210 4

5. Tips in Debugging Identify errors by systematically commenting out and running parts of your code Use // to comment out a line Use /* and */ to comment out a segment of codes IST210 5

6. 6 Bug! When we don’t comment out this line! echo "Your number is $y ";

7. Learn to Debug Bad question “What’s wrong with my code?” “I have no clue why it is not working” You need to identify the specific location and/or the specific problem in your code, and then ask questions like “Am I using the dots and quotation marks in this echo command correctly?” “Can you explain to me what’s the difference between A==B and A=B?” Know how to debug is a very important skill ! Totally ok to make mistakes when coding You are encouraged to make mistakes! But you need to know where is the mistake, how to fix it, and how to avoid making the same mistake again.  that’s how you gradually become an expert in programming (a.k.a, geek) IST210 7

8. HTML Table Tables Format data in a way that can be easily comprehended Elements Table Headings Rows Data IST210 8

9. An Example of HTML Table Firstname Lastname John Smith Anthony Kim IST210 9 Try it Tables are defined with the tag. Tables are divided into table rows with the tag. Table rows are divided into table data with the tag. A table row can also be divided into table headings with the tag.

10. An Example of HTML Table Firstname Lastname John Smith Anthony Kim IST210 10 Try it Step 1. Open a NotePad++ Step 2. Input codes Step 3. Save it to “table.html” to your webspace Step 4. Open a web browser, and visit http://my.up.ist.psu.edu/PSUID/table.html

11. PHP Array Array is a data structure that allows you to manage a list of data easily. Color list: red, yellow, blue It is not efficient to use a variable to represent each value. $color1= "red"; $color2 = "yellow"; $color3 = "blue"; IST210 11

12. Use Array in PHP Color list {"red", "yellow", "blue”}; $color[0] = "red"; $color[1] = "yellow"; $color[2] = "blue"; IST210 12 Key Array name Like C/C++, PHP uses 0-based numbering

13. Use Array in PHP IST210 13 <?php $color[0] = "red"; $color[1] = "yellow"; $color[2] = "blue"; echo $color[0]." "; echo $color[1]." "; echo " $color[2] "." "; ?> Try it PHP is a very flexible language. When accessing arrays by offset, you can actually use two different types of syntax: the [] syntax we've covered, or you can use curly braces ({}) color.php

14. Using For Loop to Retrieve Array Values IST210 14 <?php $color[0] = "red"; $color[1] = "yellow"; $color[2] = "blue"; for ($i=0; $i<3; $i++) { echo $color[$i]." "; } ?>

15. Modify array elements IST210 15 <?php $color[0] = "red"; $color[1] = "yellow"; $color[2] = "blue"; $color[1] = "green"; for ($i=0; $i<3; $i++) { echo $color[$i]." "; } ?> Try it

16. Using Foreach Loop to Retrieve Array Values IST210 16 No need to know the length of the array <?php $color[0] = "red"; $color[1] = "yellow"; $color[2] = "blue"; foreach ($color as $currentcolor) { echo $currentcolor." "; } ?> Try it You can think of foreach as jumping from element to element in the array and running the code between {}s for each of those elements For each thing in $color, assign that thing temporarily to the variable $currentcolor. No need to use the name $color. Just as for loop, we can name our temporary variable anything we want

17. Initialization of Array IST210 17 $color[0] = "red"; $color[1] = "yellow"; $color[2] = "blue"; $color = array("red", "yellow", "blue"); <?php $color = array("red", "yellow", "blue"); foreach ($color as $currentcolor) { echo $currentcolor. " "; } ?> Try it Start with index 0 $color[0] = “red”

18. Use PHP Array to Control HTML Font IST210 18 <?php $color[0] = "red"; $color[1] = "yellow"; $color[2] = "blue"; foreach ($color as $currentcolor) { echo " ".$currentcolor." "; } ?> Try it

19. Use PHP Array to Generate a HTML Table (Important!) Firstname Lastname John Smith Anthony Kim IST210 19 <?php echo " Name Table "; $lastname = array('Smith', 'Kim', 'Davis'); $firstname = array('John', 'Anthony', 'Richard'); echo " "; echo " Lastname "; echo " Firstname "; echo " "; for ($i=0; $i<count($lastname); $i++) { echo " "; echo " $lastname[$i] "; echo " $firstname[$i] "; echo " "; } ?> Try it PHP (dynamic) HTML (Static)

20. More Examples on Loop and Array For loop http://php.net/manual/en/control-structures.for.php Foreach loop http://php.net/manual/en/control-structures.foreach.php While loop http://php.net/manual/en/control-structures.while.php Array http://php.net/manual/en/language.types.array.php IST210 20

21. Reminder Assignment P3 due on next Wednesday 11:59PM (Oct 28) Report 2 and Assignment 4 due today Visit the project page on our website: https://sites.psu.edu/ist210w/ https://sites.psu.edu/ist210w/ IST210 21