The Input FileUpload object represents an HTML <input> element with type="file".
| Property | Description |
|---|---|
| accept | Sets or gets the accept attribute of the file upload button |
| autofocus | Sets or gets whether a file upload button can automatically get focus upon page load |
| defaultValue | Sets or gets the default value of a file upload button |
| disabled | Disable or enable the file upload button |
| files | Get a FileList object containing the file or files selected with the file upload button |
| form | Get the form that contains the file upload button |
| multiple | Sets or gets whether we can select more than one file in the file upload field |
| name | Sets or gets the name attribute of the file upload button |
| required | Sets or gets whether a file must be selected before submitting a form |
| type | Get type of the file upload button |
| value | Returns the path or the name of the selected file |
The Input FileUpload object supports the standard properties and events.
We can access an <input> element with type="file" by using getElementById().
<!DOCTYPE html>
<html>
<body>
<input type="file" id="myFile">
<button onclick="myFunction()">test</button>
<!--from ww w.jav a 2 s . c o m-->
<script>
function myFunction() {
var x = document.getElementById("myFile");
x.disabled = true;
}
</script>
</body>
</html>
The code above is rendered as follows:
We can create an <input> element with type="file" by using the document.createElement() method.
<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">test</button>
<script>
function myFunction() {<!-- ww w . j a va 2 s. c o m-->
var x = document.createElement("INPUT");
x.setAttribute("type", "file");
document.body.appendChild(x);
}
</script>
</body>
</html>
The code above is rendered as follows: