File Upload

The <tc:file/> create an input field with a choose directory button on the right.

Basics

<tc:file label="Upload" value="#{uploadController.file1}"/>

Upload

Read Only

Disabled

For this demo the required attribute is set to false, for better playing around with is. You may activate it with the switch below. Activate Required

Required

Content type and size

You can filter files using the <tc:validateFileItem/> tag within the <tc:file/>. In the following example only images and PDF files are excepted. Max size is 1 MB

Upload image/PDF

Placeholder

Define a text with placeholder attribute

Upload image

Markups

The size can be changed with markup large or small.

Multiple files

You can upload multiple files in one selection and request. Use the multiple="true" attribute.

Multiple

Ajax

Ajax can be activated by adding <f:ajax/> to the <tc:file/> tag.

Ajax

Drop Zone

Upload image

Drop Zone without Label

Drop Zone with Ajax

Ajax

Uploaded Files

Name	Type	Size	Used Action
No rows available

Menu

File Upload

Basics

Content type and size

Placeholder

Markups

Multiple files

Ajax

Drop Zone

Drop Zone without Label

Drop Zone with Ajax

Uploaded Files