Chapter 5 Web Application Development

Chapter 5 Web Application Development Slide 1
CHAPTER 5:
Web Application Development
Topics covered:-
Hidden Form Fields
Passing Values
Query Strings
File Uploads
HTTP Headers
AMIT 2043 Web Systems and Technologies

Learning Outcomes
At the end of this chapter, you should be able to
• Pass values to a PHP script using hidden form fields
• Pass values to a PHP script using query strings
• Write PHP scripts to upload and download files
• Use HTTP Headers for redirecting a browser to a new URL

Sending Values to a Script

• Two methods of passing values to a PHP script
a.) Use of HTML’s hidden input type
b.) Append the value to the URL

Hidden Form Fields (1)

• To pass form values from one PHP script to another PHP script,
store the values in hidden form fields via the <input> element
<input type="hidden“ name= “..” value=“..”>
• Hidden form fields temporarily store data that needs to be sent to

a server that a user does not need to see
• Access the values submitted from the form with the $_GET[] and
$_POST[] superglobal variables

Hidden Form Fields (2)

phphidden.html
<h3>Who are the happiest people ? <br>
Click the button to find out. <br></h3>
<form method="post" action="phphidden.php">
<input type="hidden" name="people" value="Babies">
<input type="submit" value="Send">
</form>
phphidden.php
<body>
<?php
echo "<h3>I am sure you guess correctly! <br/>
$_REQUEST['people']</h3>";
?>
</body>

Query Strings (1)

• A query string is a set of name=value pairs appended to a target URL
• Add a question mark (?) immediately after the URL followed by the
query string
• Separate individual name=value pairs within the query string using
ampersands (&)
• Read value using the GET method
• Syntax:
page.php?name1=value1
&name2=value2&name3=value3
• Any space in the string would be problematic.
Solution - use the urlencode() function
Eg:
$url = 'page.php?name=' . urlencode(‘John Smith');

register.php
<?php
if(isset($_POST['submitted'])) {
if ((isset($_REQUEST['name'])) && (isset($_REQUEST['email'])) ) {
$name=$_POST['name'];
echo "<h3> You have successfully registered! $name</h3></br>\n ";
echo "<a href='welcome.php?name=$name'>Click here to proceed</a><br/>";
} else {
echo "<h1>Error</h1>";
}
}
?>
welcome.php
<?php
print "Welcome to TAR College </br>".$_GET['name']."!<br/>\n";
print '<a href="register.php">Click here to return to home page</a><br/>';
?>
AMIT 2043 Web Systems and Technologies example 2
Handling File Uploads (1)

• Syntax to handle a file upload must has three parts:
<form enctype="multipart/form-data"
action="script.php" method="post">
<input type="hidden" name="MAX_FILE_SIZE"
value="30000" />
File <input type="file" name="upload" />
• Files are uploaded using the “post” method
• An enctype attribute must have a value of “multipart/form-data,” which
instructs the browser to post multiple sections – one for regular form data
and one for the file contents
• MAX_FILE_SIZE must come before the file input.
• The file input field creates a Browse button for the user to navigate to
the appropriate file to upload

Handling File Uploads (2)

• The move_uploaded_file() function moves the uploaded file from
its temporary location to a permanent destination. Syntax:
move_uploaded_file (temporary_filename,
/path/to/destination/filename);
• The function returns TRUE if the move succeeds, and FALSE if the move
fails.
• Data about the uploaded file can be obtained from the $_FILES array.
Index Meaning
name The original name of the file on the user’s computer
type The MIME type of the file, as provided by the browser.
size The size of the uploaded file in bytes.
tmp_name The temporary filename of the uploaded file on the server
error The error code associated with any problem
if (isset($_POST['submitted'])) {
// Check for an uploaded file:
if (isset($_FILES['upload'])) {
if (move_uploaded_file ($_FILES['upload']['tmp_name'],
“../uploads/{$_FILES['upload']['name']}")) {
echo '<p><em>The file has been uploaded!</em></p>';
} else { echo '<p class="error">Upload fails</p>';
}
} // End of isset($_FILES['upload']) IF.
// Delete the file if it still exists:
if (file_exists ($_FILES['upload']['tmp_name']) && is_file($_FILES['upload']['tmp_name']) ) {
unlink ($_FILES['upload']['tmp_name']);
} } // End of the submitted conditional.
?>
<form enctype="multipart/form-data" action="upload_image.php" method="post">
<input type="hidden" name="MAX_FILE_SIZE" value="524288">
<fieldset><legend>Select a JPEG or PNG image of 512KB or smaller to be uploaded:</legend>
<p><b>File:</b> <input type="file" name="upload" /></p></fieldset>
<div align="center"><input type="submit" name="submit" value="Submit" /></div>
<input type="hidden" name="submitted" value="TRUE" />
</form>
example 4\upload_image.php
HTTP Headers (1)

• PHP’s built-in header() function can be used for
 Redirecting the Web browser from the current page to
another.
 Sending files to the Web browser
 etc
• Syntax:
header(header string);

HTTP Headers (2)

redirect.html
<h1>Using HTTP headers to redirect the Browser</h1>
Which page would you like to see?
<form name="form1" action="redirect.php" method="post">
<input type="submit" name="button" value="Homepage">
</form>
<form name="form2" action="redirect.php" method="post">
<input type="submit" name="button" value="Catalog">
</form>
redirect.php
<?php
$redirect = "Location: " . $_REQUEST['button'] . ".html";
echo header($redirect);
?>
HTTP Headers (3)

• To send a file to the Web browser, three header calls are used.
Content-Type : tells the Web browser the kind of data is to be sent.
Content-Type value matches the data’s MIME type.
Content-Disposition: tells the browser how to treat the data
attachment – to download
Inline – display
Content-Length : the amount of data to be sent.
• Each of the multiple header() calls should be terminated by a newline (\n)
• A header() function must be called before anything (including HTML or
blank spaces) is sent to the Web browser.
Example :
header("Content-Type:application/pdf\n");
header("Content-Disposition:attachment; filename=\"ff.pdf\"\n");
header ("Content-Length: 4096\n");

HTTP Headers (4)

Index.html
<body>
Welcome to the world of "Beautiful Scenery"<br>
<img src=show_image.php?imname=Sunset.jpg><br>
</body>
<?php // show_image.php
$im= stripslashes($_REQUEST[imname]);
$image = "../uploads/$im";
$info = getimagesize($image);
$fs = filesize($image);
// Send the content information:

header ("Content-Type: {$info['mime']}\n");
header ("Content-Disposition: inline; filename=\"$im\"\n");
header ("Content-Length: $fs\n");
// Send the file:

readfile ($image);
example 4
AMIT
?> 2043 Web Systems and Technologies
HTTP Headers (5)

• getimagesize() function returns an array containing the
following data:
Element Value
0 image’s width in pixels
1 image’s height in pixels
2 image’s type (2 representing JPG)
3 appropriate HTML img tag data
mime image’s MIME type

Example: Stock Maintenance (1)
Chapter5\add_print.php

Chapter5\view_print.php


Chapter5\view_stock.php
Chapter5\edit_stock.php Chapter5\delete_stock.php
References
• PHP and MySQL by Ullman, L. Peachpit Press
• PHP Programming with MySQL Second Edition
by Gosselin, D., Kokoska, D. & Easterbrooks, R.
Course Technology

Chapter 5 Web Application Development

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Chapter 5 Web Application Development

Uploaded by

Copyright:

Available Formats

Chapter 5 Web Application Development Slide 1

AMIT 2043 Web Systems and Technologies

AMIT 2043 Web Systems and Technologies

Sending Values to a Script

AMIT 2043 Web Systems and Technologies

Hidden Form Fields (1)

• Hidden form fields temporarily store data that needs to be sent to

AMIT 2043 Web Systems and Technologies

Hidden Form Fields (2)

AMIT 2043 Web Systems and Technologies

Query Strings (1)

AMIT 2043 Web Systems and Technologies

Handling File Uploads (1)

AMIT 2043 Web Systems and Technologies

Handling File Uploads (2)

HTTP Headers (1)

AMIT 2043 Web Systems and Technologies

HTTP Headers (2)

HTTP Headers (3)

AMIT 2043 Web Systems and Technologies

HTTP Headers (4)

// Send the content information:

// Send the file:

HTTP Headers (5)

1 image’s height in pixels

2 image’s type (2 representing JPG)

3 appropriate HTML img tag data

mime image’s MIME type

AMIT 2043 Web Systems and Technologies

Example: Stock Maintenance (1)

AMIT 2043 Web Systems and Technologies

Example: Stock Maintenance (2)

AMIT 2043 Web Systems and Technologies

Example: Stock Maintenance (3)

AMIT 2043 Web Systems and Technologies

You might also like