In order to be able to upload to the server, one or more files in the form of a special field is applied. In Firefox, IE and Opera this item is displayed as a text box, which is located next to the button labeled "Browse ..." (Fig. 1). In Safari, and Chrome is only available button "Select File" (Fig. 2).
Fig. 1. The field of view to download a file in Firefox
Fig. 2. Download the file into Chrome
By clicking on the button opens a window to select the file where you can specify what the user wants to use the file.
field syntax to send the file to the next.
The attributes are listed in the Table. one.
|accept||Sets the filter on the types of files that you can send through the field to upload files.|
|size||The width of the text field, which is determined by the number of fixed-width font.|
|multiple||It allows you to select and upload multiple files at once.|
|name||Name field is used to identify the form handler.|
Before you can use this field in the form, do the following:
- set the POST method to send data (method = "post");
- set at the value of the attribute enctype multipart / form-data.
Form to download the file shown in Example 1.
Example 1: Creating a field to send the file
Отправка файла на сервер
Although you can set the width of the field by the size attribute, in fact, the width does not affect the result of the form. In Safari and Chrome browsers this attribute is generally no effect no effect.
multiple attribute is more important, it allows you to not be limited to one file to select, and specify them for multiple simultaneous downloads.
If you accept the attribute is not specified, then add, or upload files of any type. The presence accept to limit the choice of a file, which is especially important when you want to load only the image or video. The value serves MIME-type, multiple values are separated by a comma. You can also use the following key words:
- audio / * - selection of music files of any type;
- image / * - image files;
- video / * - video.
Table. 2 shows some of the allowable values accept attribute.Table. 2. File Types
|image/jpeg||Only the JPEG files.|
|image/jpeg,image/png||Only files in JPEG and PNG format.|
|image/*||Any image files.|
|image/*,video/*||Any graphic and video files.|
Using additional attributes shown in Example 2.
Example 2: Upload photos
Not all browsers support the new attributes. IE ignores multiple and accept, Safari does not support the accept, but Firefox does not work with the MIME-type, only with keywords. Therefore, in the example above specifically for Firefox set image / *, image / jpeg. Also note a strange bug in Opera, it does not allow spaces after the comma within accept.
Example results are shown in Fig. 3. Please note that due to the presence of multiple slightly changed form of the field.