dynamic web pages 2009v2.1

28/06/2009

Database php version 2.1 1

Dynamic Web PagesDynamic Web PagesDynamic Web PagesDynamic Web PagesPHPPHP

1

Authors & Modifications

First Edition 2006 Version No.

1.0 1.1 2.0 2.1

Authors Date 07/06 08/06 07/08 07/09

Cathie Usher Contact Cathie Usher Cathie Usher Cathie Usher Cathie Usher

2

28/06/2009


Chapter 1Chapter 1Chapter 1Chapter 1Site management Site management

&&

3

&&Sending & Receiving data between pages.Sending & Receiving data between pages.

Dynamic web page decisions• The first decision is to decide what

scripting language you are going to p g g g y g gwrite your dynamic pages in.– PHP: Generally uses an Apache server

with php. – ASP: Generally uses Microsoft Internet

Information Services (IIS), which has

4

nformat on Ser ces ( S), wh ch has an asp engine incorporated.

28/06/2009


How PHP Pages are Accessed and Interpreted

2. Send R1. Web Browser

Your PC(Internet connected)

WebServer(Internet connected)

Web ServerSend Request for PHP filePlease EnterAPhoneNumber

Submit Erase

Web Browser

7. Web Browser

Web ServerSoftware

3. Receiverequest, find

file and read it.

4. ExecutePHP

statements

5. Sendresultsback

5

We will use WAMPS (Windows, apache, mysql, php server) and it will be locally installed on the lab machines.

6. Return ResultsPhone QueryResults:

That isJohn Doe'sPhoneNumber

back.

WAMPS• This web service has three servers;

– Apachep– MYSQL – PHP

• Wamps will be located locally on the lab machines. So the lab machines will b l l d s hi

6

be a local and server machine.

28/06/2009


Creating a PHP Script File and Saving It to a Local Disk

You can use a number of different editors to P P f l create your PHP script files.

– The PHP script starts with a <?php tag and ends with ?>. – Between these tags is a single PHP print statement.

7

Alternative PHP Delimiters• You can alternatively start your PHP

scripts with the <script> tag as follows:p p g f<script language="PHP">

print ("A simple initial script");

</script>

• If have short_open_tag enabled in its configuration file, you can use <? and ?>.

8

• If asp_tags is enabled in the PHP configuration file, you can use <% and %> as delimiters.

28/06/2009


A Little About PHP's Syntax

• Some PHP Syntax Issues:Some PHP Syntax Issues:– Be careful to use quotation marks, parentheses, and

brackets in pairs. – Most PHP commands end with a semicolon (;).– Be careful of case.

l– PHP ignores blank spaces.

9

Embedding PHP Statements Within HTML Documents

• One way to use PHP is to embed PHP scripts within HTML tags in an HTML document.

1.<html>1.<html>2.<head> 3.<title>HTML With PHP Embedded</title> </head>4.<body> 5.<font size=5 color=”blue”>Welcome To My Page</font>6.<?php7. print ("<br> Using PHP is not hard<br>");8 ?>8.?>9.and you can learn to use it quickly! 10. </body></html>

10

28/06/2009


Using Backslash (\) to Generate HTML Tags with print()

• Sometimes you want to output an HTML h l d bl tag that also requires double quotation

marks.– Use the backslash (“\”) character to signal that the

double quotation marks themselves should beoutput:

11

print ("<font color=\"blue\">");– The above statement would output:<font color="blue">

Using Comments with PHP cripts

• Comments enable you to include ydescriptive text along with the PHP script.– Comment lines are ignored when the

script runs; they do not slow down the run-time.

12

– Comments have two common uses.• Describe the overall script purpose.• Describe particularly tricky script lines.

28/06/2009


Using Comments with PHP Scripts

• Comment Syntax - Use //y<?php

// This is a comment

?>

• Can place on Same line as a statement:<?php

print ("A simple initial script"); //Output a

13

print ( A simple initial script ); //Output a line

?>

Example Script with Comments1. <html> <head>2. <title> Generating HTML From PHP</title> </head>g / /3. <body> <h1> Generating HTML From PHP</h1>4. <?php5. //6. // Example script to output HTML tags7. //8. print ("Using PHP has <i>some advantages:</i>");9. print ("<ul><li>Speed</li><li>Ease of use</li>li i li /li / l ") //O b ll li

14

<li>Functionality</li></ul>"); //Output bullet list10. print ("</body></html>");11. ?>

28/06/2009


Alternative Comment Syntax

PHP allows a couple of additional ways to create comments.

<?php

phpinfo(); # This is a built-in function

?>

• Multiple line comments. <?php

/*

15

A script that gets information about the

PHP version being used.

*/

<? phpinfo(); ?>

Using PHP Variables• Variables are used to store and

access data in computer memory. p y• A variable name is a label used

within a script to refer to the data.

16

$cost = 4.25; $months = 12;

Name of variable Variables new value

28/06/2009


Assigning New Values to Variables

• You can assign new values to variables:

$days = 3;

$newdays = 100;

$days = $newdays;

• At the end of these three lines, $daysand $newdays both have values of 100.

17

and $newdays both have values of 100.

Selecting Variable Names• You can select just about any set of

characters for a variable name in PHP characters for a variable name in PHP, but they must:– Use a dollar sign ($) as the first character– Use a letter or an underscore character (_)

as the second character.N T l i bl h

18

• Note:Try to select variable names that help describe their function. For example $counter is more descriptive than $c or $ctr.

28/06/2009


Combining Variables and the print Statement

That is to print out the value of $x • That is, to print out the value of $x, write the following PHP statement:– print ("$x");

• The following code will output “Bryant is 6 years old”.

19

$age=6;

print ("Bryant is $age years old.");

A Full Example ...1. <html>2 <head> <title>Variable Example </title> </head>2. <head> <title>Variable Example </title> </head>3. <body>4. <?php5. $first_num = 12;6. $second_num = 356;7. $temp = $first_num;8. $first_num = $second_num;9. $second_num = $temp;

20

10. print ("first_num= $first_num <br>second_num=$second_num");11. ?> </body> </html>

28/06/2009


Using Arithmetic Operators• You can use operators such as a plus sign (+)

for addition and a minus sign (–) for for addition and a minus sign ( ) for subtraction to build mathematical expressions.

• For example<?php

$apples = 12;

$oranges = 14;

21

$oranges = 14;

$total_fruit = $apples + $oranges;

print ("The total number of fruit is $total_fruit");

?>

• These PHP statements would output “The total number of fruit is 26.”

Common PHP Numeric Operators

Table 2.1 Common PHP Numeric OperatorsTable 2.1 Common PHP Numeric Operators

Operator Effect Example Result

+ Addition $x = 2 + 2; $x is assigned 4.

- Subtraction $y = 3; $y = $y – 1;

$y is assigned 2.

/ Division $y = 14 / 2; $y is assigned 7.

22

* Multiplication $z = 4; $y = $z * 4;

$y is assigned 16.

% Remainder $y = 14 % 3; $y is assigned 2.

28/06/2009


A Full Example1. <html>2. <head> <title>Variable Example </title> </head>3. <body>y4. <?php5. $columns = 20;6. $rows = 12;7. $total_seats = $rows * $columns;8.9. $ticket_cost = 3.75;10. $total_revenue = $total_seats * $ticket_cost;11.12. $building_cost = 300;

23

13. $profit = $total revenue - $building cost;14.15. print ("Total Seats are $total_seats <br>");16. print ("Total Revenue is $total_revenue <br>");17. print ("Total Profit is $profit");18. ?> </body> </html>

WARNING: Using Variables with Undefined Values

If you accidentally use a variable that does not have a value assigned to it will have no value (called a nullvalue assigned to it will have no value (called a null value).When a variable with a null value is used in an expression PHP, PHP may not generatean error and may complete the expression evaluation. For example, the following PHP script will output x= y=4.

<?php

24

$y = 3;$y=$y + $x + 1; // $x has a null valueprint ("x=$x y=$y");?>

28/06/2009


Writing Complex Expressions• Operator precedence rules define

th d i hi h th t the order in which the operators are evaluated. For example,

$x = 5 + 2 * 6;

• The value of $x is either 42 or 17 depending on order of evaluation.

25

p g f• Since multiplication evaluated before

addition operations, this expression evaluates to 17.

PHP Precedence Rules

• PHP follows the precedence rules • PHP follows the precedence rules listed below.– First it evaluates operators within

parentheses.– Next it evaluates multiplication and

di i i t

26

division operators.– Finally it evaluates addition and

subtraction operators.

28/06/2009


PHP Precedence Rules• For example, the first 2

statements evaluate to 80 while statements evaluate to 80 while the last to 180.– $x = 100 - 10 * 2;

– $y = 100 - (10 * 2);

– $z = (100 - 10) * 2;

27

A Full Example1. <html>2 <head> <title>Expression Example </title>2. <head> <title>Expression Example </title> </head>

3. <body>4. <?php5. $grade1 = 50;6. $grade2 = 100;7. $grade3 = 75;

28

8. $average = ($grade1 + $grade2 + $grade3) / 3;

9. print ("The average is $average");10. ?> </body> </html>

28/06/2009


Working with PHP String Variables

• Character strings are used in scripts to hold data such as customer names hold data such as customer names, addresses, product names, and descriptions.

• Consider the following example.– $name="Christopher";

29

– $preference="Milk Shake";

• $name is assigned “Christopher” and the variable $preference is assigned “Milk Shake”.

WARNING: Be Careful Not to Mix Variable Types

• Be careful not to mix string and numeric variable types.

• For example, you might expect the following statements to generate an error message, but they will not. Instead, they will output “y=1”.<?php

$x ="banana";

$sum = 1 + $x;

30

print ("y=$sum");

?>

28/06/2009


Using the Concatenate Operator

• The concatenate operator combines two t t i i bl i t separate string variables into one.

• For example,– $fullname = $firstname . $lastname;

• $fullname will receive the string values of $firstname and $lastname connected together.

31

g• For example,

$firstname = "John";

$lastname = "Smith";

$fullname = $firstname . $lastname;

print ("Fullname=$fullname");

TIP; An Easier Way to Concatenate Strings

• You can also use double quotation marks to qcreate

• concatenation directly, • For example,

• $Fullname2 = "$FirstName $LastName";

Thi t t t h th ff t

32

• This statement has the same effect as

• $Fullname2 = $FirstName . " " . $LastName;

28/06/2009


The strlen() Function• Most string functions require you to send

th tthem one or more arguments.• Arguments are input values that functions

use in the processing they do.• Often functions return a value to the

script based on the input arguments For

33

script based on the input arguments. For example $len = strlen($name);

Variable or value to work with

Name of functionReceives the number of

characters in $name

The strlen() Function Example

<?php p p$comments = "Good Job";$len = strlen($comments);print ("Length=$len");

?>This PHP script would output “Length=8”.

34

p p g

28/06/2009


The trim() Function

• This function removes any blank characters yfrom the beginning and end of a string. For example, consider the following script:– <?php

– $in_name = " Joe Jackson ";

– $name = trim($in_name);

35

– print ("name=$name$name");

– ?>

The strtolower() and strtoupper() Functions

• These functions return the input string in all pp s ll l s l tt s sp ti luppercase or all lowercase letters, respectively.

• For example,<?php$inquote = "Now Is The Time";$lower = strtolower($inquote);$upper = strtoupper($inquote);print ("upper=$upper lower=$lower");

36

?>

• The above would output “upper=NOW IS THE TIME lower=now is the time”.

28/06/2009


The substr() Function

– Substr has the following general format:

$part = substr( $name, 0, 5);

Assign theextracted sub-string into thisvariable.

Extract from thisstring variable

Starting position tostart extraction from.

Number of charactersto extract. (If omitted it willcontinue to extract until the endf th t i )

37

string variable. of the string.)

The substr() Function• The substr() function enumerates character

positions starting with 0 (not 1) positions starting with 0 (not 1), – For example, in the string “Homer”, the “H” would be

position 0, the “o” would be position 1, the “m” position 2, and so on.

• For example, the following would output “Month=12 Day=25”.

38

<?php

$date = "12/25/2002";

$month = substr($date, 0, 2);

$day = substr($date, 3, 2);

print ("Month=$month Day=$day");

?>

28/06/2009


The substr() Function• As another example, consider the following

use of the substr() function– It does not include the third argument (and thus

returns a substring from the starting position to the end of the search string).<?php

$date = "12/25/2002";

$year = substr($date, 6);

39

print ("Year=$year");

?>

• The above script segment would output “Year=2002”.

Servers and files• The php files need to be located on

the server.• The location for wamps is C:\wamps\www\• All files must be place here.• In dreamweaver you will work on files

that are local on your storage space:

40

that are local on your storage space: f, h etc.

• When these local files are save they will automatically be uploaded to the server.

28/06/2009


Dynamic Web pages requirements• Create a local site: shown on the next

slide.• Check WAMPS is running.

– On the lab machines sometimes the IIS starts first and blocks the port. If this happens you must stop the IIS.

• Create a dynamic and testing site:

41

• Create a dynamic and testing site: shown on the following slides.

Creating a local site

Local folder is your yH or F drive etc.

42

28/06/2009


Creating a remote site

43

Note: You will have to create this folders, newlandStart. This can be done using the browse button. wamp\www\ is the default directory.

Creating a Testing Server

44

28/06/2009


Transferring to the Remote server

• Click on the “expand show local & remote sites” button.

• Click on the “put files” button; the blue arrow.

45

Changing htm to php• Change all the htm &

html pages to php. This is done by click on • This is done by click on the name in the file panel and changing the extension. (same as renaming in windows).

• An update screen will appear

46

appear.• Click ok.

28/06/2009


Check the pages• Open each page one at a time

followed by the “f12” key to execute y ythe page in the browser.

• Once all pages have been executed you should be able to test the links on each page.If th li k t ki h k

47

• If the links are not working, check they are to the asp extension pages.

Using forms to send data.• Overview:

– In this section you will create pages ith b dd d fwith embedded forms.

– The forms will have objects, such as text fields, submit buttons, radio buttons etc.

– The data in the form objects will be sent to the server and be displayed on

48

sent to the server and be displayed on another page.

28/06/2009


Retrieving data• Overview:

– The are four ways of transferring data y gfrom one page to another.• Through a form with the post method.• Through a form with the get method.• Through a URL link• Through a cookie.

49

• HTML Forms are not part of PHP language but important way to send data to scripts

Creating HTML Input Forms

Text BoxRadio Buttons

Check Box

50

Select Box

Text Area

Submit/Reset button

28/06/2009


Starting And Ending HTML Forms

• You can create HTML forms by using the HTML <form> and </form> tags

<form action="http://webwizard.aw.com/~phppgm/program.php" method="post">

Program to start when form is submitted.

Place form elements between

.Format tosend data.

HTML <form> and </form> tags.

51

<form> and </form> tags...

</form> Forms end with </form>

Creating Form Buttons• You can create submit and reset buttons by

placing the following within <form> & </form> tags.

<input type=”submit” value=”Click To Submit”> <input type=”reset” value=”Erase and Restart”>

Type ofbutton to create Button Label

52

• The submit button will be labeled “Click To Submit”. The reset button will be labeled “Erase and Restart”.

28/06/2009


Another Full Script Example1.<html>2.<head> <title> A Simple Form </title> </head>3 <body>3.<body>4.<form action="http://webwizard.aw.com/~phppgm/First.php"

method="post" >5. Click submit to start our initial PHP program.6. <br> <input type="submit" value="Click To

53

p ypSubmit">

7. <input type="reset" value="Erase and Restart">8. </form>9. </body> </html>

Receiving Form Input into PHP Scripts

• To receive HTML form input into a PHP script: – Use a PHP var name that matches the variable defined in the form – Use a PHP var name that matches the variable defined in the form

element’s name argument.

• For example, if form uses the following: – <input type="radio" name="contact" value="Yes">

• Then form-handling PHP script could use a variable called $contact.

54

$

– If the user clicks the radio button, then $contact would = Yes

28/06/2009


Full Example• Suppose your HTML form uses the following:

– Enter email address: <input type="text" size="16" maxlength="20" name="email">g

• Then can receive input as follows:1.<html>2.<head><title> Receiving Input </title> </head>3.<body>4.<font size=5>Thank You: Got Your Input.</font>5 <?php

55

5.<?php6. print ("<br>Your email address is $email");7.8. print ("<br> Contact preference is $contact");9. ?>

Register_Globals?• Since PHP 4.2.1, the default PHP

configuration is requiring a different h i t i i t f it mechanism to receive input for security

reasons (than the one just shown).– Technical details: it is a PHP configuration option

to turn REGISTER_GLOBALS OFF (new default) or ON in the php.ini configuration file.

56

• If your site has REGISTER_GLOBALS OFF you must use a different mechanism to receive HTML Form Variables.

28/06/2009


How can you tell if Register_Globals is OFF?

• Enter the following PHP script and run it. g p– <?PHP phpinfo(); ?>

• Search through the output for REGISTER_GLOBALS and see if it is set to OFF or ON. If it i ff t th f ll i t

57

• If it is off you must use the following way to receive input data.

Getting input data with Register_Globals OFF?

• To receive data with REGISTER_GOBALS FF l bl ll d $P OFF you use a special variable called $POST.

– $name $_POST[“name”];Enclose in squarebracket and then quotes

Name of HTML form i bl ( t d t $)

58

variable (note do not use $)

Special PHP Global variable. Technically it is an associative array (covered in chptr 5.)

PHP variable name that you want to receive the HTML form input.

28/06/2009


Full Example, when REGISTER_GLOBALS is OFF.• Suppose your HTML form uses the

following: following: – Enter email address: <input type="text" size="16"

maxlength="20" name="email">

• Then can receive input as follows:1. <html>2. <head><title> Receiving Input </title> </head>3. <body>

59

y4. <font size=5>Thank You: Got Your Input.</font>5. <?php6. $email = $_POST[“email”];7. $contact = $_POST[“contact”];8. print ("<br>Your email address is $email");9. print ("<br> Contact preference is $contact");10. ?>

Forms sending & retrieving 1• Create a new page and save as

test_form.php.• Title : Using a form.• Add a form, 2 textfield and a submit

button.• The page should look like;

60

28/06/2009


Forms sending & retrieving 2• Properties of objects • Textfield 1:

N fi tN– Name= firstName• Textfield 2:

– Name=lastName• Form

– Name=frmName– Action=test form processor php

61

Action=test_form_processor.php– method-=POST.

Forms sending & retrieving 3• Create another page called

test_form_processor.php.p p p• Title: Displaying form data.• Create the page as shown and select

the plus to bind the form data.

62

28/06/2009


Forms sending & retrieving 4• Select the form variable.• Select the Request.Form Select the Request.Form

type.• The name should be the

same as the name on the page the data is coming f

63

from.

In this case the data is coming from test_form.php

Forms sending & retrieving 5• Place the cursor after the comer after

the “Thank you ”.• Click on the binding firstName and then

click on the insert button. This inserts the request variable into that space on the page.

• To insert the binding you can also drag and d th th d

64

drop as another method.• Repeat this for the lastName variable.

28/06/2009


Forms sending & retrieving 6• Your page should look like this.

• Now execute the test form php

65

Now execute the test_form.php page.

Note: You will need to put a non breaking space ( ) between the two form bindings

Looking at the code.• Normally php code is embedded with

<?php ?>

• Echo is the command to display

66

information. There are two other commands: print() and printf().

• The two print command allow formatting of text.

28/06/2009


Retrieving data via URL 1• Open test_form.php and save as

test_form_get.php.Change the form method to GET• Change the form method to GET.

• Open test_form_processor.php file and save as test_form_processor_get.php.

• Delete the bindings.• Insert 2 new bindings:

– the URLVariable

67

– the URLVariable. – Next slide shows how.

Retrieving data via URL 2Select the URL Variable and the screen below will appear. Put the name of the variable from the page calling this one, as shown; firstName

The new binding as shown

68

gwill appear. Drag it to where the variable should be shown. The next slide shows this.

28/06/2009


Looking at the code• This code is similar to the form

request, except the form has change q p gto GET.

69

Sending data with Hyperlinks.• When you send data with forms and a

method of GET, information is sent in the URLURL.

• Another method of sending the info in the URL is in a Hyperlink.

• To do this you can just add the information in a name and info pair to the

l f th li k

70

url of the link. eg:– ?firstName=Larry

28/06/2009


Sending data with Hyperlinks 2.• 1st page.

• Click on a link, eg cat and the page appears like.

71

• Click on dog and the page appears like.

Sending data with Hyperlinks 3• Create a page and save it as

animal_question.php and create it to l k lik thilook like this.

• The links are to the page

72

The links are to the page animal_home_page.php

28/06/2009


Sending data with Hyperlinks 4• The links on the animal_question.php

page should look like..p g• Cat

• Dog

73

g

Sending data with Hyperlinks 5

• Another way to set the link with parameters is, click on the browse picon select the file and click on the parameters buttons as shown.

74

28/06/2009


Sending data with Hyperlinks 6• The animal_home_page.php should

look like.

• Create the URL Variable as before

75

with the binding panels.

Cookies - 1• The form and querystring request are

stateless variables. Once the server has d th t th li t th h passed them onto the client the server has

no memory of them.• Cookies are tiny text files that are

written onto the user’s hard drive.• Cookies help to maintain state over coming

th t t l HTTP t l

76

the stateless HTTP protocol.

28/06/2009


Cookies - 2• Cookies and security

– Cookies can’t be used to infect computer pwith a virus.

– Cookies can only be read by the site that sent them.

– Cookies should never contain credit card details, password, etc.

77

, p ,

Cookies - 3• Open the test_form_processor_get.php file .• Create a new page test_form_processor_cookies.php• Add the following to the test_form_processor_get.php

filefile.

Cookie variable name

78This code must be place before the html tag

28/06/2009


Cookies - 4• Create the bindings and place them in

the design view of the gtest_form_processor_cookies.php file.

• As shown, then save and preview.

79

Lab 1• Objectives • After completing this lab, you should p g y

be able to: – Create URL variables in the Bindings

panel. – Display URL variables on a page. – Create FORM variables in the Bindings

l

80

panel. – Display FORM variables on a page.

28/06/2009


Lab 1 cont-2• Copy the folder lab_start from the x

drive to your working drive.y g• Create a new site called lab• Setup the folders on the IIS root folder

and the remote and testing servers.

81

82unit2sendingpage.php

28/06/2009


83

unit2formactionpage.php

84

unit2urlactionpage.php?firstname=Larry

28/06/2009


Chapter 2Chapter 2Chapter 2Chapter 2Sending form details via emailsSending form details via emails

85

PHP Sending E-mails• PHP allows you to send e-mails directly from a script.y p

• The PHP mail() Function• The PHP mail() function is used to send emails from inside a script.

86

28/06/2009


Syntax

N t F th il f ti t b il bl PHP i

87

Note: For the mail functions to be available, PHP requires an installed and working email system. The program to be used is defined by the configuration settings in the php.ini file. Read more in our PHP Mail reference.

PHP Simple E-Mail• This can be used to check if the

server is setup correctly.p y

88

28/06/2009


Sending Emails - 1• 1st check that SMTP is installed.

Through the window component g pwizard. Highlight IIS and click on details.

• If the SMTP is ticked then it is installed if not you need to install it.

89

Sending Emails - 2• Overview:

– In this task you will create a message y gsent page that will transfer the data to an email.

– The page that obtains the email data is the contact.php page. You will add a table with no borders and a form to

90

send the information to the message_sent.php page.

28/06/2009


Sending Emails - 3• Open the generic_template.php and

save it as message_sent.phpg p p• Looks like this

91

• Make it look like this, with link to index.php.

Sending Emails – 4• Add the php code as shown.

92

28/06/2009


Sending Emails - 5• Open contact.php and change it to look like this. Details on the

next slide.

93

Sending Emails - 6• Position the insertion point below the image

caption, and choose Insert > Form > Form to create a new form.

• Without moving the insertion point, choose Insert > Table, providing

the following settings. Click OK. – Rows: 4 – Columns: 2 – Width: 95 Percent – Border: 0

94

Border: 0 – Cell Padding: 3 – Cell Spacing: 0

28/06/2009


Sending Emails - 7• Select the <table> tag using the tag selector, and

use the Property inspector to change its bgcolor (background color) attribute to #eeeeee, which is a light gray a light gray.

• In the right column of the table insert the following; – Two text fields called,

• emailAddress• subject

– One text area called body– A Submit button

95

• In the first three cells of the left column, enter the following text: – Your Email Address – Subject – Message Body

Sending Emails - 8• Select the text area and give it the

following specifications;– Char Width :55Char Width 55– Num Lines as 6, and Wrap as Virtual.

• Select the form in the tag selector, in the Property inspector set: – Name = frm_message – Action = messageSent.php – Method = POST

96

• Insert a Heading 2 element above the table that reads, “Send Us a Message.”

28/06/2009


Client-Side Form Validation• Open contact.php• Select the submit Select the subm t

button• In the behaviours

panels add a behaviour as h

97

shown.

Client-Side Form Validation• In the Validate form dialog as shown

set the fields as– emailAddress: Required as an email– Subject: Required as anything– Body: Required as anything.

• Resulting with the dialog shown b l

98

below.

28/06/2009


Client-Side Form Validation• Notice the behaviours

panel should look like pthis when you highlight the submit button.

• Save and test the validation

99

validation.

Lab 2 - 1• Overview:

– Create a html form with client-side validation

– Create an action page to send an email.• Your overview instructions located in

the next section of the book: lab section

100

section. • Your two pages will look like the

following 2 slides.

28/06/2009


Sendemail.php

101

Sendemail_action.php

102

28/06/2009


Sample of email sent

103

Lab 2 - 1• Open server_side_scripting site• Open tourtemplate.php. • Change to Split view • Change to Split view. • In the Design view pane, click on the link

Or email us. • In the Property inspector change the link

to link to sendemail.php. Hit the enter key after putting in the link (if you don’t hit enter the value will not be saved)

104

enter, the value will not be saved). • Save tourtemplate.php.

28/06/2009


Lab 2 - 2• Create an Email Form Page

– Save tourtemplate.php as sendemail.php. – Replace the generic left heading with Send Replace the generic left heading with Send

Email. – Replace the generic Left Side Text with the

text “Fill in the values in the form and submit the form to send an email to us. Thank you for your interest.”

– Create a new form below the text. • Name the form email.

105

• Set the action to sendemail_action.php. • Make sure that the Method is Post.

Lab 2 - 3• Create a table inside the form with 2 columns and 4 rows.

– Type in the labels as shown in the table below. • From Address • Subject j• Message Body

– In the second column, • first row put a text field and name it from• With a width of 30 and max of 50.

– In the second row, • put a text field and name it subject• with the same width and max.

– In the third row, • put a textarea control and name it message

106

p g• with a width of 40 and 10 rows.

– In the last row, – first column put a submit button control – with a label of Send Email.

28/06/2009


Lab 2 – 4• Create Action Page

– Create a new page from tourtemplate.php • name : sendemail_action.php. p p

– Note that the email link now points to sendemail.php. • Change the left section title to Email Complete

and the text to “Thank you for your email.” • In bindings, create 3 new Request variables:

– from – subject

message

107

– message

Lab 2 - 5• In Code view make space between

the heading and the text Type the heading and the text. Type the following php code.

108

28/06/2009


Lab 2 - 6• Replace your email address with mine.

The From address would normally be yhard coded with the site’s email address.

• Save the page. • Preview the sendemail.php page. Fill

t th f d b it it i

109

out the form and submit it using your email address as the sender.

Lab 2 - 7• Client Side Validation

– Return to Dreamweaver and the sendemail.php page. – Select the Submit button. – In the Behaviours panel, click Add Behaviour and choose

Validate Form. – Make all of the fields are required and validate the

email address. • Save the page. • Preview sendemail.php. • Check that validation is working by trying to

110

• Check that validation is working by trying to submit an empty form and also try an invalid email address format.

28/06/2009


Chapter 3Chapter 3Chapter 3Chapter 3SelfSelf--server applicationserver application

&&

111

&&ServerServer--side validationside validation

Self-server Applications• These applications are answering a

question that would usually be q yanswered by the staff in the tours company.

• An example is how much does it cost to do this tour and another tour.W ill t t l l t

112

• We will create a tours calculator, (self-server application).

28/06/2009


The tour calculator page - 1• Open the generic_template.php and

save as tourprice_processor.php and p p p ptourprice.php.

• The two pages are shown on the next slides.

113

The tour calculator page - 2

Objects names:

txtNumberAdults

114

tourprice.php

txtNumberChildren

cboTourName

28/06/2009



115tourprice_processor.php

Calculate link to tourprice.php page

Contact link to contact.php


116

28/06/2009


The tour calculator page - 5• tourprice.php has the following properties.

– Form• Name = frm tourprice • Name = frm_tourprice • Action = tourprice_processor.php• Method = POST

– Table inside the form• 4 rows • 2 columns • width of 60 percent

117

– List values• Highlights of Argentina, 500 • Highlights of Western Canada, 700 • Egyptian Pyramids and More, 900

Calculating the price - 1• Open tourprice_processor.php page.• Input the php code as shown to;

– declare and initialise the number of adults, kids and tour name.

– Calculate the price of the tour.

Variable declaration

118

Check you have the same variable names in your tourprice.php page as those in quotes.

28/06/2009


Calculating the price - 2• Now you have calculated the tourprice

variable, you need to display it. This is done by placing php script amongst the html code as placing php script amongst the html code, as shown below.

• Save and view the page. What happens when you don’t put in an amount for the adults or kids?

119

The calculator so far….• So far the calculator works if

numeric values are put in the adults pand kids fields.

• Errors appear if not values are placed in the adults and kids fields.

• The next couple of slides are going to dd l f d t

120

add a css rule for errors and trap the error with php code.

28/06/2009


Adding new style to the css• Add an error style to the css file with the

following properties;– Type: class – Name: error– Weight : bold– Colour : #990000

• This style will be used if the client makes ith th i f ti f th t

121

an error with the information for the tour calculator.

Server-side validation -1• Server-side validation is validating the

tourprice.php page variables sent to the tourprice_processor.php page.

• This is done by checking the two form variables for numerical values, as shown.

• If one of them doesn’t hold a numeric value the client is sent back to the tourprice.php page, displaying an error.

• Add the code

122

• Add the code.

28/06/2009


Server-side validation- 2• Once the client is sent back to the

tourprice.php page the code to pick up this error is needederror is needed.

• This code shows the response to that variable and displays a message to the client.

123

Lab 3 - 1• In this lab you are to add a list/menu to

reservations.php and change the form action to call the page reservations_action.php.p g p p

• The two pages are shown on the next slides.• To have “Yes” or “No” displayed on equipment you

will have to write an if statement finding out if the box was ticked, “true” or not ticked, “false”.

If request.form(“equipment”)=“true” then

(“ )

124

response.write(“No”)

Else

response.write(“Yes”)

End If

28/06/2009


Lab 3 - 2

125reservations.php

The value for each label is: 1 for Nepal Track, 2 for Alasken Wilderness, etc.

Lab 3 - 3

126reservations_action.php. This page was created form tourtemplate.php.

Reservation Information from reservation.php page

28/06/2009


Chapter 4Chapter 4Chapter 4Chapter 4Introduction to Databases in PHPIntroduction to Databases in PHP

127

Overview• In this chapter you will :

– Create a database connection in dreamweaver.

– Create a recordset.– Display data from the recordset.

128

28/06/2009


Placing the database on the server• We are going to using the database

you created in the sql component: y q pnewlands.

• Make sure this is database is in the sql directory as shown below.

129

Exploring the Database• Open the database called

newland_tours.mdb.• This is the database that you will be

working with.• The relationships look like this.

130

28/06/2009


Connecting the site to a database• Select the + as shown.• The following sql The follow ng sql

connection appears, select it.

• This will produce a dialog as shown.

Note the database tag has been selected.

131

Complete the dialog as shown.Test the connection and click OK

Check the Connection• Click on the + and explore

the tables etc.the tables etc.

• Note a folder has been added to your site with the connection php file.

• This file is a Dreamweaver

132

configuration.

28/06/2009


What’s in the connection file?

133

Displaying data Using a recordset- 1

• Open the index.php file p pin design view and delete the highlight text.

134

28/06/2009


Displaying data - 2• Select the traveller’s journal image and

right click on the h3 tag in the tag selector.• Select the remove tag from the pop up

menu.

135

Displaying data - 3• Select

the + in th

Creating a recordset

the bindings as shown.

• Fill in the dialog as

136

dialog as shown.

28/06/2009


Displaying data - 4• Drag and drop

description as shownshown.

• Looks like• You can also view Data

using the live data as shown

137

Lab 4 -1• Overview

– Create sql connection for the lab qdatabase

– Create a dreamweaver connection– Create a recordset for the equipment.– Create a dynamic table using the

equipment recordset

138

equipment recordset.

28/06/2009


Lab 4 equpment.php Design

139

Dynamic table

Lab 4 equipment.php live

140

28/06/2009


Lab 4 -2• Connect the site to the database

– call it dwda.• Open equipment.php page.• Create a recordset

– Call it rs_equip– Select all field except EquipID– Sort on EquipType field in Ascending order.

141

• Test the recordset.

Lab 4- recordset

142

28/06/2009


Lab 4 -3• Select the HTML table containing equipment and

delete the table. • On the Application tab on the Insert bar, click On the Application tab on the Insert bar, click

Dynamic Data and choose Dynamic Table. • Choose all records from the rs_equip recordset

and give a border of 1 and a cellpadding of 3. • Click OK. • Change the headings to be more descriptive and

bold them.

143

• Save the page and preview it.

Lab 4 -4• Format the price column

– Select the binding on the page for the price column. – In the Bindings panel, the price column will be g p , p

highlighted. Drop down the Format column’s select box and choose Currency > Default. Refer to next slide for menus.

• Note: You may not see the Format column in the Bindings panel if it is too narrow. You can expand the panels or scroll within the Bindings

l

144

panel. • Preview the page. You should see the same list of

equipment now coming from the database.

28/06/2009


Formatting numbers.

145

Chapter 5Chapter 5Chapter 5Chapter 5Dynamical CalculationsDynamical Calculations

146

28/06/2009


Overview• In this chapter you will:

– Dynamically populate a drop-down menu.y y p p p– Create a recordset using a filter from

the form data on the previous asp page.– Insert dynamic text.– Write the code to handle errors when

data has not validated

147

data has not validated.

Dynamically populated drop-down menus.

The next activity will d d create a drop-down

menu which is populated from the database through a recordset.

148

tourprice.php

28/06/2009


Dynamic calculation • Remember the Tour Calculator.• We are going to change it to dynamically

put the tour locations in the list/menu, (with the ID being the value) on the tourprice.php page.

• On the tourprice_processor.php, we will then use the id to select the adult and hild t t l l t th t th

149

child rate to calculate the cost or the tour.

Create a tourprice recordset

Test the recordsetTest the recordset

View the sql statement with the advanced button.

150

28/06/2009


Dynamic drop-down• Open tourprice.php page and select

the list/menu.• Select the dynamic button.• Remove the static labels and values

with the – button.

151

• Fill the dialog as

Dynamic drop-down-2

gshown.

152

28/06/2009


• Save and view as shown.

Dynamic drop-down-3

153

Next Activity: Creating dynamic textDynamic text

tourprice_processor.php

Click on the submit button

154

tourprice.php

Click on the submit button.

The data in the form is transferred to the tourprice_processor.php page. The price is calculated using the form data.

28/06/2009


• Open tourprice_processor.php page.• Create a new recordset (shown on

Dynamic calculation

next slide), with the following attributes: – Name = rsTourpricesFiltered – Connection = conn_newland– Table = tours

155

– Columns = selected tourID, tourName, basePriceAdult, basePriceChild

• Click the Test button. Enter 9 in th Pl P id

Filtered recordset

the Please Provide a Test Value dialog, and click OK.

• Click OK to exit the test output

156

the test output, and again to save the recordset. Note: This recordset has a filter on

it. The recordset will only select a tour id that equals tour is that was selected from the pervious asp page.

28/06/2009


• Place xx as shown.• Highlight xx.

Displaying dynamic text

g g• Select Dynamic Text

as shown.• The dialog shown

appears, select tourName and click

157

tourName and click OK.

• Delete the code that sets the base price.

Fixing up the price.

p

• Add the following lines

158

28/06/2009


• Add the following to avoid calculation errors.

Avoiding errors

• Save and view the pages.

159

Lab 5 - 1• In this lab you will;

– Create a dynamic list/menu for the yreservation.php page, shown on the next slide.

– Add a dynamic feature tour list, as shown on the following slides.

160

28/06/2009


Lab 5 - 2

161Reservation.php

Dynamic tour list•Note: Duplicate entries because the same trip is offered on different dates.

Lab 5 – 3 tourtemplate.php

Static Featured tours

162

Dynamic Feature tours

28/06/2009


Lab 5 - 4• reservations.php page. • create a recordset

– named rs tours from the tours table. nam rs_tours from th tours ta . – Select only TourID, TourName, and TourDate – sort by TourName.

• Click the Dynamic button on the Property inspector. – Dynamically fill the values from the recordset

that you just created The values are the TourID

163

that you just created. The values are the TourID – Labels are the TourName – Click OK to close the dynamic dialog.

• Save the page and preview it. Drop down the list to see the dynamic values.

Lab 5 - 5• Create a recordset• Delete the text under

the Featured Tours the Featured Tours heading.

• Add a dynamic table as shown. Remember border=0. Save and view.

164

28/06/2009


Chapter 6Chapter 6Chapter 6Chapter 6Filtering & Displaying DataFiltering & Displaying Data

165


– Transfer dynamic data through the URL.y g– Add repeating regions.– Creating recordsets with information

from the URL.– Adding images dynamically.

166

28/06/2009


Changing profiles.php• The profiles page displays the countries

statically.• We are going to change this to dynamically We are going to change this to dynamically

from the database.

167Profiles current page

Profiles_details.php• Create a profiles_details.php page

from the generic template.g p

168

28/06/2009


profiles.php - 1• Delete the countries so the

profiles.php page is as shown.p p p p g

169

profiles.php - 2• Create a recordset as shown.

170

28/06/2009


profiles.php - 3• Insert a country

name field binding, as shown.

• With this insertion highlighted click on the browse icon for a link.

• Filling the browse as shown.

171

• Select the parameters button.

profiles.php – 4• In the parameters dialog

box, click under the name column heading and type column heading and type the names as shown.

• Click on the lighting bolt and select as shown for both values.

• This parameters button writes the url code in the li k

172

link.• Here we are passing the

country ID and name in the URL.

28/06/2009


profiles.php – 5• Notice now the binding is a link.

• Notice the link sends the id of the country in the URL.

• With the link highlighted– In the server behaviours

173

In the server behavioursPanel click + and chooseRepeat Region, as shown.

profiles.php – 6• Adding a repeat region and click on

OK.

• A section page of the page is shown. Check that the break is inside the

174

repeat region

28/06/2009


profiles.php – 5• View the page. It should look like

175

profiles_details.php• Open the profiles_details.php• Create a recordset and complete the page to look like below.• The following slide have the details on how complete it.

Heading 1

176

Heading 2

process_details.php

28/06/2009


Create the recordest

177

Click the advanced.. button.

Combining two tables• Add the other table; region.• Add the where clause to join the

t bltables.

178

28/06/2009


Add Bindings & View• Add the bindings as shown on the pervious slides.• The finished page should look like:

179

Inspecting the pervious sql• Take a look at the Sql• What does it meanWhat does t mean

180

28/06/2009


Dynamic images -1• Now we are going to add the image

that go with the country.g y• Place the cursor as shown.

181

• From the menu select insert->image.

Dynamic images -2• Select as

shown and li k OKclick OK.

• Create the imageright css rule and apply it to

182

apply it to the image.

28/06/2009


Dynamic images -4• Completed page.

183

Lab 6 -1• Dynamically creating a repeated region for

the tour packages and their dates.• Then the tour ID is sent in the URL to

open the tourpackages.php page.• The tourpackage.php page uses the tour

ID to display the info about the selected tour package.

184

• The following slides show the changes of the two pages.

28/06/2009


Lab 6 -2• What the page look like now.

185tours.php

Lab 6 -3• What the page will look like at the

end

186tours.php

28/06/2009


Lab 6 -4• Current

page

187tourpackages.php

Lab 6 -5• What the page will look like at the end

188tourpackages.php

28/06/2009


Chapter 7Chapter 7Chapter 7Chapter 7SQL with Joins & Recordset SQL with Joins & Recordset

189

PagingPaging


– Use the SQL term INNERJOIN.Q– Adding a recordset navigational tool bar.

190

28/06/2009


tours_detail.php - 1• For this activity you are going to;

– create a page that joins the information p g jfrom two tables on a set of criteria.

– Add a recordset paging object.• The page is shown on the next two

slides.

191

Part 1 of tours_details.php

192

28/06/2009


Part 2 of tours_details.php• Adding recordset Paging

193

tours_detail.php - 2• Open generic_template.php

– Title: Newland Tours: Tour Descriptions.p– Save as tour_details.php.

• Make the following changes to the page as shown.

Heading 2

194

g

Link to tours.php

28/06/2009


tours_detail.php - 3• Create a recordset as follows;

195

tours_detail.php - 4Dynamic image

Table width=60%

For these links refer to following slides.

196

Using the recordset add the bindings and the repeat region ( 5 records at a time), to the page as shown.

28/06/2009


tours_detail.php - 5• The link “Learn more about” has the

following details.

197

tours_detail.php - 6• Price this tour with Tour price

calculator.

198

28/06/2009


tours_detail.php - 7• Insert the dynamic image’s placeholder

and set it right align.

199

Adding a repeat region• Highlight all the recordset data.• Select the server behaviour tab.Select the server behav our tab.• Click on the plus symbol and select

repeat region.• Select five records at a time, as

shown below.

200

28/06/2009


Part 2Recordset Navigation-1

• Inserting a recordset navigation can be done by the following two.

201

Recordset Navigation-2• When you add a navigation the

recordset dialog appears as shown.g pp

• Save and preview.

202

p

28/06/2009


Fixing up the tourprice.php page• Create a querystring variable as

shown below.

• Click to select the drop-down menu in the form, beside Tour name. In the

203

Property inspector, click the Dynamic button. Shown on the next slide.

Dynamic list

204

Click on the lighting bolt and the Dynamic Data dialog box appears.

28/06/2009


Lab 7 -1• This lab creates a page called

bookedtours.php.p p• The tour bookings information is

shown on the next slide.

205

Lab 7 -2

206

28/06/2009


Chapter 8Chapter 8Chapter 8Chapter 8Dynamic searchingDynamic searching

207

Creating a search.• In this chapter you are going to

create sql statements that search qfor information.

• The next slides show the changes to the tours.php page, tours_details.php page and index.php page

208

28/06/2009


tours.php

209

tours_details.php

210

28/06/2009


index.php

211

Preparing the search page.• Make the changes to the tours.php

page as shown on the next page.p g p g

212

28/06/2009


tours.php page1.Change text

Link to tourprice.php

2. Insert table

Recordset for the dynamic list values

213

A recordset shown on next page.

A form with the following details

list values.

Creating the recordsets -1.

214

28/06/2009


Creating the recordsets -2.

215

Dynamic list

216

28/06/2009


Creating the repeating section

217

Region Link

218

The filtering on the link would work until we change the query on the tour_details.php page which is done later.

28/06/2009


Now fix the index.php

Profiles.php link

Contact.php link.

219

A recordset and a repeat region. This is the same as the world region recordset in the tours.php page.

tours_details.php page

Recordset

Image shown on the following pages

h2

h1

Li k t

Recordset shown on the following slides

Insert a

220

Link to toursprice.php shown on the next page

Insert a table

28/06/2009


Tour price calculator link

221

Tour details recordset

222

28/06/2009


Image details

223

Adding a recordset navigation• Add a recordset navigation to the

bottom of the tours_details.php page as shownas shown.

• Add the find Tours link to tours.php page

224

28/06/2009


Looking at the codeAdd this code to tours_details.php When you select view all

countries from the tours.php page this is the recordset you what to use.recordset you what to use.

225

When you click on the region link this is the recordset to use

If you select a country from the tours.php page then this is the recordset to use.

Adding an if in case there are no records

Add these lines

226

28/06/2009


Lab 8 Overview• In this lab you will:

– Create a search interface by creating a form and allowing the user to select a value from a and allowing the user to select a value from a list/menu object and returning the tours that match the selected value.

• Objectives:– Group data in a select statement– Create a search page from a form

Implement a search results page using the

227

– Implement a search results page using the value the user selected on the form.

– Add conditional logic to the SQL statement.

You will create this page

228

Searchreservations.php

28/06/2009


Receiving data from searchreservations.php

229

bookedtours,.php

Chapter 9Chapter 9Chapter 9Chapter 9Using Session variables, hidden Using Session variables, hidden

fields & inserting data.fields & inserting data.

28/06/2009


Overview• In this chapter you will

– Create restricted administration pages.p g– Use Session variables– Use hidden fields– Insert records into a table.

Creating an Insert Journal Pg -1

Open the generic_template.php.

Save as journalAdd.php.

Change the page as shown above.

28/06/2009


Insert a record

• On the j lAdd h journalAdd.php page and select the “Insert Record” as shown.

• The next slide he next sl de shows the screen that appears.

Inserting a record

• Notice that the JournalID field needs a value. • This value needs to be increased by one.

– Eg: last value is 3 the next value needs to be 4.

28/06/2009


Adding a recordset to find the id value• Create this recordset to find the

largest number.

Creating a new journal ID

• Find the recordset code as shown above.Add li 61 & 62• Add lines 61 & 62.

• These lines obtain the highest id and add one to it.

28/06/2009


Storing the id in the form.• Add a hidden

textfield in the form as shownform as shown.

• Write the value as shown. This is the value of the new id that was calculated at the top of the page on top of the page on the previous slide.

Placing the insert record script• Double click on the insert record

made earlier and add the new id as the journalID.

28/06/2009


Session VariablesSession VariablesSession VariablesSession Variables

Creating a Session variable• Create a basic page as shown with a

textfield and button in a form.

Create a new page and call it • Create a new page and call it createsession.php.

• Link the form to the createsession.php page.

28/06/2009


Creating a Session variable - 2

• To create a session variable the session_start() function must be the 1st line in _ ()the document.

• Then declare and initialise the variable as shown below. Post from the page before.

Creating a Session variable - 3

• Create the page below, starting the session and then displaying it.p y g

• Create a link on the createsession.php to this page. This is show on the previous slides.

28/06/2009


Classes in phpClasses in phpClasses in phpClasses in php

Creating A Class

• Classes are similar to Java and actionscript.• A class has a constructor or a default on is added at A class has a constructor or a default on is added at

compilation time.• Below is the start of a person class.• This class is to hold the info about the people that log

into the following pages.Name of the class and file name must be identical.

D l i i bl Declaring variables.

Constructor must be identical to the class name.

28/06/2009


Creating a Class -2• The gets and

the sets.• The close of

the class• The close of

the php tag.

Using the class to store variables• The next couple of slides show the

code to create a session variable so it can store an array of objects.

• These objects are created using the Person class.

28/06/2009


Using the class to store variables-2• A login page to start the session

variable.

Using the class to store variables-3• The design view of the add people

page.p g

28/06/2009


Using the class to store variables-4• The php code. The include

statement allows access to the Person lclass.

Using the class to store variables-5

• The html code on the page.

28/06/2009


Using the class to store variables-6

• How to view the data in the class.

Using the class to store variables-7Table headings.

Obtaining the number of objects in the array.objects in the array.

Getting each variable for each object.

Placing each variable in the table

28/06/2009


Using the class to store variables-8• These files can be found a zipped

folder called classes.zip on pmyChisholm.

dynamic web pages 2009v2.1

Technology