File Field
The file
field.
Properties
Title | File |
Description | Field for uploading files. |
Field Type | file |
Base Field Type | text |
Schema
Property | Type | Default | Description |
---|---|---|---|
allowOptionalEmpty | Allows this non-required field to validate when the value is empty | ||
autocomplete | string | Allows you to specify the autocomplete attribute for the underlying input control whether or not field should have autocomplete enabled. | |
data | object | Allows you to specify a key/value map of data attributes that will be added as DOM attribuets for the underlying input control. The data attributes will be added as data-{name}='{value}'. | |
disallowEmptySpaces | boolean | Whether to disallow the entry of empty spaces in the text | |
disallowOnlyEmptySpaces | boolean | Whether to disallow the entry of only empty spaces in the text | |
enum | array | List of specific values for this property | |
inputType | string | Allows for the override of the underlying HTML5 input type. If not specified, an assumed value is provided based on the kind of input control (i.e. 'text', 'date', 'email' and so forth) | |
maskString | string | Expression for the field mask. Field masking will be enabled if not empty. | |
placeholder | string | Field placeholder. | |
size | number | 40 | Field size. |
trim | boolean | Remove whitespace from the beginning and end of string | |
typeahead | Provides configuration for the $.typeahead plugin if it is available. For full configuration options, see: https://github.com/twitter/typeahead.js |
Options
Property | Type | Default | Description |
---|---|---|---|
name | string | Field Name. | |
selectionHandler | boolean | Function that should be called when files are selected. Requires HTML5. | |
sort | function | Defines an f(a,b) sort function for the array of enumerated values [{text, value}]. This is used to sort enum and optionLabels as well as results that come back from any data sources (for select and radio controls). By default the items are sorted alphabetically. Don't apply any sorting if false. |
Example 1
File field.
Example 2
File field rendered in display-only mode.
Example 3
Nested file fields.
Example 4
Select an image file to see it with instant thumbnail preview
Example 5
Upload a file and track via a progress bar. A lot of folks ask about how to upload an asset and track it via a progress bar. There are many ways to do this. Here we show one way to do it by using a form and tracking when the submit button is clicked. Select an image file to see it with instant thumbnail preview