2. XHTML MP Example Demonstrating File Upload
The following example demonstrates how to upload a file from a Nokia 6230 cell phone. Here is the XHTML MP document of the example. As XHTML MP is compatible with HTML/XHTML, this XHTML MP document can also be opened with web browsers such as Microsoft Internet Explorer and Mozilla Firefox.
<?xml
version="1.0"?>
<!DOCTYPE html PUBLIC
"-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>File
Upload Example</title>
</head>
<body>
<h1>Welcome
to our photo album.</h1>
<form
action="file_upload.php" method="post"
enctype="multipart/form-data">
<p><br/>
Choose
a photo to upload to the WAP server:
<input
name="myFile" type="file"/><br/>
On
the WAP server, save the file as: (Enter something here if you want
the file to be saved in a different file name.)
<input
name="filename"
type="text"/>
</p>
<hr/>
<p>
<input
type="submit"/>
<input
type="reset"/>
</p>
</form>
</body>
</html>
The above XHTML MP document enables the user to choose a photo to upload and specify a different name for the file if he/she wants to do so.
If you have read our XHTML MP tutorial, the tags and attributes in the above XHTML MP document should be very familiar to you, with the exception of the enctype attribute of the <form> tag. The enctype attribute is used to specify how the form data should be encoded in the HTTP request when the method attribute value is post. The default value of the enctype attribute is "application/x-www-form-urlencoded". It has to be changed to "multipart/form-data" to enable file upload.
In most cases, that's all we need to know about "multipart/form-data" since we will not parse the form data encoded in HTTP requests ourselves but to use functions provided by a server-side technology. Writing the functions by our own is error-prone and is not recommended. If you need to learn the details of the "multipart/form-data" format, please refer to the Form-based File Upload in HTML (RFC 1867) document.
Note that the above XHTML MP document does not conform to the XHTML MP specification since "file" is not a valid value of the type attribute of the <input> tag in standard XHTML MP. Thus, the document cannot pass the check of an XHTML MP validator.
The screenshots below show what you will see on the screen of the Nokia 6230 cell phone:
|
If you click the file select field, you will see something like this:
|
Select the "Memory card" item in the above menu and you will see something like this:
|
Select the "Options" softkey in the bottom left-hand corner of the screen of the cell phone and you will see:
|
Select the "Select" option. The mobile browser will go back to the first page and the name of the file chosen will be displayed in the file select field, like this:
|
If you click the submit button of the form, the form data will be posted to the WAP server.
Now the only thing left is to write a server-side script to extract the uploaded file from the HTTP request and save it to the local file system or a database.
In the following sections, we will introduce to you how to handle file uploads with PHP and Java Servlet / JSP. If you use a server-side technology other than PHP and Java Servlet / JSP, the code will be different but the idea is the same.
Previous Page | Page 2 of 11 | Next Page |