file

This page has been flagged with the following issues:

High-level issues:

Content:

Summary

The file type of the <input> element represents widget for specifying a file.

Overview Table

DOM Interface	HTMLInputElement

Examples

[This example uses HTML code to submit a file selected by the user to Cpshost.dll, which is installed with Posting Acceptor. View live example]The following example lets the user choose one or more files, and then displays the choices. The files list can also be used to upload to a website.

HTML

<!DOCTYPE html>
<html >
<head>
<title>Files property test</title> 
<script type{{=}}"text/javascript">
function getFiles() {
// Get input element
myFileList {{=}} document.getElementById("myfiles");
// loop through files property, using length to get number of files chosen
for (var i {{=}} 0; i < myFileList.files.length; i++) {
// display them in the div
document.getElementById("display").innerHTML +{{=}} "<br/>" + myFileList.files[i].name ;
}
}
</script>
</head>
<body>
<label>Use <strong>shift</strong> or <strong>ctrl</strong> click to pick a few files: 
<input type{{=}}"file" multiple id{{=}}"myfiles" onchange{{=}}"getFiles();" /></label>

<div id{{=}}"display"></div>
</body>
</html>

The following examples use the INPUT type=file element to upload a file to a server. The first example requires Microsoft Posting Acceptor, which can be used with IIS or Personal Web Server.

<form name="oForm"
   action="repost.asp"
   enctype="multipart/form-data"
   method="post">
<input type="file" name="oFile1"/>
<input type="submit" value="Upload File">
</form>

This example shows the Active Server Page (ASP) content of Repost.asp. Notice that the properties of the uploaded file are accessible from the submitted form.

<%@ LANGUAGE = JScript %>
<%
   Response.buffer=true;
%>
<html>
<title>Repost Example</title>
<body>
<h1>Upload Status</h1>
<p> 
Destination: <b><% Response.Write(Server.HTMLEncode(Request.Form("TargetURL"))) %></b> 
</p> 
<% 
   Response.write("<P>Name: " + Server.HTMLEncode(Request.Form("FileName")) + "</P>"); 
   Response.write("<P>Size: " + Server.HTMLEncode(Request.Form("FileSize")) + "</P>"); 
   Response.write("<P>Path: " + Server.HTMLEncode(Request.Form("FilePath")) + "</P>"); 
%> 
</body>
</html>

Notes

Remarks

For a file upload to take place:

The INPUT type=file element must be enclosed within a FORM element.
A value must be specified for the NAME attribute of the INPUT type=file element.
The METHOD attribute of the FORM element must be set to post.
The ENCTYPE attribute of the FORM element must be set to multipart/form-data.

Note For code samples, see Form controls part 1 and Form controls part 2: validation on the Windows Internet Explorer sample site. To handle a file upload to the server, a server-side process must be running that can handle multipart/form-data submissions. For example, the Microsoft Posting Acceptor allows Microsoft Internet Information Server (IIS) to accept file uploads. Additional Common Gateway Interface (CGI) scripts that can handle multipart/form-data submissions are available on the Web.

Windows Internet Explorer 8 and later. When a file is selected by using the input type=file object, the value of the value property depends on the value of the "Include local directory path when uploading files to a server" security setting for the security zone used to display the Web page containing the input object. For more information, see value. Windows Internet Explorer 7 and later. By default, Internet Explorer does not include folder or directory path information when uploading files to sites in the Restricted zone. This improves security by preventing information disclosure. Also, to improve accessibility, the INPUT type=file element now contains two accessible elements—one for the input box and one for the Browse button. This change is applicable only to accessibility tools; script implementations are not affected. Microsoft Internet Explorer 6 for Windows XP Service Pack 2 (SP2) and later. For security reasons, the input type=file element no longer accepts relative file paths. Microsoft Internet Explorer raises an Access Denied exception when the user attempts to submit a form containing an input type=file element that contains a relative path. The INPUT type=file element is available in HTML and script as of Microsoft Internet Explorer 4.0. The file upload add-on is required to use the INPUT type=file element in Microsoft Internet Explorer 3.02. Users can enter a file path in the text box or click the Browse button to browse the file system. When a file is uploaded, the file name is also submitted.

Standards information

HTML 4.01 Specification, Section 17.4
HTML5 A vocabulary and associated APIs for HTML and XHTML, Section 4.10

HTML information

Closing Tag	forbidden
CSS Display	inline

Members

The input type=file object has these types of members:

[#events Events]
[#methods Methods]
[#properties Properties]

Events

The input type=file object has these events. {

Compatibility

Desktop

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic Support	1.0	1.0	3.02	1.0	1.0

Mobile

Feature	Android	BlackBerry	Chrome for mobile	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Opera Mini	Safari Mobile
Basic Support	?	?	?	?	Unsupported	?	?	Unsupported

Search

file

How to Use

file

Summary

Overview Table

Examples

Notes

Remarks

Standards information

HTML information

Members

Events

Compatibility

Desktop

Mobile

See also

Related pages (MSDN)