ms3304: week 4 php & html forms. overview html forms elements refresher sending data to a script...
TRANSCRIPT
![Page 1: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/1.jpg)
MS3304: Week 4
PHP & HTML Forms
![Page 2: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/2.jpg)
Overview
• HTML Forms elements refresher• Sending data to a script via an
HTML form– The post vs. get methods– Name value pairs
• Capturing and using data sent via an HTML form
• Special formatting considerations
![Page 3: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/3.jpg)
Forms – text box
<input type="text" name="myName" value="">
Attributes• Type – what type of form object• Name – the name of the object• Value – whatever is entered into the
text field
![Page 4: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/4.jpg)
Forms – radio button
<input type="radio" name="gender" value="m">Male
<input type="radio" name="gender" value="f">Female
Attributes• Type – what type of form object• Name – the name of the group• Value – the value of each individual radio
button
![Page 5: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/5.jpg)
Forms – checkbox
<input type="checkbox" name="Sprinkles" value="1">Sprinkles<input type="checkbox" name="chocSauce" value="2">Chocolate Sauce<input type="checkbox" name="whipped_cream" value="1">Whipped Cream
Attributes• Type – what type of form object• Name – the name of the object• Value – whatever is set as the value
![Page 6: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/6.jpg)
Forms – pull down menu (select)<select name="size">
<option value="s">Small</option>
<option value="m">Medium</option>
<option value="l">Large</option>
</select>
Attributes• Name – the name of the pull down menu• Value – the value of each of the options within
the pull down menu
![Page 7: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/7.jpg)
Forms – text area
<textarea cols="60" rows="5" name="myComment"></textarea>
Attributes• Cols – number of columns• Rows – number of rows• Name – the name of the object• Value – whatever is entered into the box. To
preload content you enter text in between the start and end tag
![Page 8: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/8.jpg)
Forms – hidden
<input type="hidden" name="userID" value="pogoda">
Attributes• Type – type of object• Name – the name of the object• Value – the value of the object – hidden
in the browser window
![Page 9: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/9.jpg)
Forms – submit button
<input type="submit" name="button1" value="Send">
Attributes• Type – type of object• Name – the name of the object• Value – the caption that appears on the
button
![Page 10: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/10.jpg)
Forms – form
<form action="processForm.php" name="myForm" method="get"></form>
Attributes• Action – the URL of the script that the
data will be sent to – this is the page that will display once the submit button is clicked
• Name – the name of the form• Method – the way the data is sent to the
script
![Page 11: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/11.jpg)
Input form example
• All objects must be inside of a form tag
• All objects inside a form tag have name and value attributes
Code Example
![Page 12: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/12.jpg)
Input form example
• When a user makes a selection or enters data into a form element, the value of the element is automatically set
• The way the data is sent to the backend script is dependent upon the method attribute set in the form tag
![Page 13: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/13.jpg)
Forms – the get method
• This is the default method• Sends a series of name value pairs
appended to the URL• It can be book marked• Can use the back button to reload
it• Limited to the amount of data that
can be sent
![Page 14: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/14.jpg)
Forms – the post method
• Sends the name value pairs to the server invisibly – they are not seen by the user
• Cannot be book marked• Page must be reloaded if you use
the back button• Much larger amounts of data can
be sent
![Page 15: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/15.jpg)
PHP $_POST[] & $_GET[] superglobals
• In order to get at the values stored in the name value pairs you use the $_POST[] and $_GET[] superglobals
• These superglobals are really arrays. They hold information about all the name value pairs that are sent to the script from the form.
• The superglobal used is based on the method chosen in the form action
![Page 16: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/16.jpg)
PHP $_POST[]
For the form element on the input page:
<form action="post" action="processForm.php“><input type="text" name="myCat" value="" size="20“></form>
In order to get at the value entered into the myCat formelement you would use the following code:
echo “I have a cat named ” . $_POST[‘myCat’];
![Page 17: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/17.jpg)
PHP $_GET[] example
For the form element on the input page:
<form action=“get" action="processForm.php“><input type="text" name="myCat" value="" size="20“></form>
In order to get at the value entered into the myCat formelement you would use the following code:
echo “I have a cat named ” . $_GET[‘myCat’];
![Page 18: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/18.jpg)
PHP $_POST[] & $_GET[] variables example
It is also possible to assign the value to a variable, and then use it
$myCat = $_GET[‘myCat’];echo “I have a cat named $myCat.”
For clarity it is good practice to name your variables the same as the form elements
![Page 19: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/19.jpg)
Escaping quotation marks in strings
• When sending data to a sever via an input form, PHP automatically escapes single and double quotation marks
• If you wish to be able to view the text as it was typed you need to unescape the escaped characters
![Page 20: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/20.jpg)
stripslashes( )
The stripslashes() function will remove the escape characters from any string
stripslashes(stringOrVariable);
You should use stripslashes() on any form value that might contain double or single quotation marks
![Page 21: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/21.jpg)
Server-side forms in PHP
• Data entered by a user via an HTML form is passed to a backend script in name/value pairs
• The values associated with each form can be accessed via the $_POST[] or $_GET[] arrays depending on the form method attribute
• Passed values can be displayed or stored in variables
• PHP automatically escapes all single and double quotation marks which must be unescaped using stripslashes() to view properly
![Page 22: MS3304: Week 4 PHP & HTML Forms. Overview HTML Forms elements refresher Sending data to a script via an HTML form –The post vs. get methods –Name value](https://reader035.vdocuments.us/reader035/viewer/2022062407/56649e155503460f94afef5a/html5/thumbnails/22.jpg)
Forms input – your turn
Write the code for the HTML and PHP pages that display the following student marks calculator where CW1 and CW2 are both worth 50% of the overall mark
marksResults.php
marksForm.php