The File Upload Element INPUT TYPE FILE

The File Upload Element <INPUT TYPE="FILE">

The last element I'll look at in this chapter is the file upload element, which enables users to upload files to the serverif you have code waiting on the server to read that code. At first glance, it might not be clear how this element fits in with the <INPUT TYPE="TEXT"> , <INPUT TYPE="PASSWORD"> , and <INPUT TYPE="HIDDEN"> elements we've already seen in this chapter, but the file upload element is just another <INPUT> element, this time with the TYPE attribute set to "FILE": <INPUT TYPE="FILE"> . You can see the properties, methods, and events of this control in Table 13.18, its properties in depth in Table 13.19, its methods in depth in Table 13.20, and its events in depth in Table 13.21.

Table 13.18. The Properties and Methods of the File Upload Element

Properties	Methods	Event
defaultValue	select	onchange
form
name
readOnly
size
type
value

Table 13.19. The Properties of the <INPUT TYPE="FILE"> Element (See Chapters 5 and 6 for the JavaScript core HTML properties, methods, and events that also apply to this element.)

Property	NS2	NS3	NS4	NS6	IE3a	IE3b	IE4	IE5	IE5.5	IE6
defaultValue	x	x	x	x	x	x	x	x	x	x
	Read/write
	Holds the default value for the controlthe value that appears in the control when control's form is reset. Set to a text string. (In practice, however, this property does not appear to work as it should. Resetting a form, either with a reset button or the reset method, does not make this property's value appear.)
form	x	x	x	x	x	x	x	x	x	x
	Read-only
	Contains a reference to the control's form. This is handy if you pass a control to a function and need access to other controls in the same form.
name	x	x	x	x	x	x	x	x	x	x
	Read/write
	Holds the name of the control, as used in code. May be changed in code, because it's read/write. Set to a name string.
readOnly				x			x	x	x	x
	Read/write
	Specifies whether the control is read-only. Set to true or false. This property is useful to "disable" text controls (although you also can use the disabled property).
size				x			x	x	x	x
	Read/write
	Sets the width of the control, measured in characters . A very handy property if you want wider text controls than the default.
type		x	x	x		x	x	x	x	x
	Read-only
	Holds the type of the file control, as a string: "file" . This property reflects the TYPE attribute of the control. As of Internet Explorer 5, the type property is read/write, but only once, when an element is created with the createElement method and before it is added to the document.
value	x	x	x	x	x	x	x	x	x	x
	Read/write
	Holds the name of the file to upload. Set to a string.

Table 13.20. The Methods of the <INPUT TYPE="FILE"> Element (See Chapters 5 and 6 for the JavaScript core HTML properties, methods, and events that also apply to this element.)

Method	NS2	NS3	NS4	NS6	IE3a	IE3b	IE4	IE5	IE5.5	IE6
select		x	x	x			x	x	x	x
	Returns: Nothing
	Selects the text in the control.
	Syntax: select() . You can use this method together with the focus method (see Chapter 6) to highlight text and set yourself up for a response from the user .

Table 13.21. The Events of the <INPUT TYPE="FILE"> Element (See Chapters 5 and 6 for the JavaScript core HTML properties, methods, and events that also apply to this element.)

Event	NS2	NS3	NS4	NS6	IE3a	IE3b	IE4	IE5	IE5.5	IE6
onchange	x	x	x	x	x	x	x	x	x	x
	Occurs when the contents of the control change and the user moves the focus away from the control.