Allowing Visitors to Upload Files

Best javascript editor debugger Ajax website
↑

Main Page

Allowing Visitors to Upload Files

If the information you need from the folks filling out your form is complicated, you might want to have them upload an entire file to your server.

Figure 17.37. To allow visitors to upload files, you must make sure to set the proper `enctype` attribute, as well as create the `file` type `input` element.

To allow visitors to upload files:

1.	Type `<form` `method="post" enctype="multipart/form-data"`. The `enctype` attribute ensures that the file is uploaded in the proper format.
2.	Next, type `action= "upload.url">`, where upload.url is the URL of the script that processes incoming files. You'll need a special script for this.
3.	Type the caption for the file upload area so your visitors know what to do. Something like `What file would you like to upload?` would work well.
4.	Type `<input type="file"` to create a file upload box and a Browse button.
5.	Type `name="title"`, where title identifies to the server the files being uploaded.
6.	If desired, type `size="n"`, where n is the width, in characters, of the field in which the visitor will enter the path and file name.
7.	Type the final `/>`.
8.	Complete the form as usual, including the submit button and final `</form>` tag. Figure 17.38. When you create a file upload area, both a field where the visitor can type the path to the file and a Browse button (so the visitor can use an Open dialog box to choose the file) automatically appear on your page.

Tips

The size attribute is optional, but since most paths and file names are pretty long, it's a good idea to set it at 40 or 50. The default is 20.
You can't use the get method for forms that allow uploading.

When to use a hidden field?

Imagine you've got a form and you want to be able to give your visitors a chance to review what they've entered before they submit it. Your processing script can show them the submitted data and at the same time create a form with hidden fields containing the same data. If the visitor wants to edit the data, they simply go back. But if they want to submit the data, the hidden fields will already be filled out, saving them the task of typing the data in again.

Best javascript editor debugger Ajax website
→

Allowing Visitors to Upload Files

Figure 17.37. To allow visitors to upload files, you must make sure to set the proper enctype attribute, as well as create the file type input element.

Figure 17.38. When you create a file upload area, both a field where the visitor can type the path to the file and a Browse button (so the visitor can use an Open dialog box to choose the file) automatically appear on your page.

When to use a hidden field?

Figure 17.37. To allow visitors to upload files, you must make sure to set the proper `enctype` attribute, as well as create the `file` type `input` element.