Skip to content

Commit f4f667a

Browse files
Chat: Add File Attachments demo description (#31846)
1 parent 5aff64a commit f4f667a

File tree

1 file changed

+21
-0
lines changed

1 file changed

+21
-0
lines changed
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
DevExtreme Chat supports file attachments. When this feature is activated ([fileUploaderOptions](/Documentation/ApiReference/UI_Components/dxChat/Configuration/#fileUploaderOptions).**uploadFile** is specified), an “Attach” button appears in the message input field, allowing users to add files to their messages.
2+
3+
When users attach files, each file is displayed in the input area with a file-type icon, basic details (name and size), upload status, and an option to remove files before sending.
4+
<!--split-->
5+
6+
You can further customize the file upload process with [fileUploaderOptions](/Documentation/ApiReference/UI_Components/dxChat/Configuration/#fileUploaderOptions) properties:
7+
8+
- **maxFileSize**
9+
Specifies the maximum allowed file size.
10+
- **minFileSize**
11+
Specifies the minimum allowed file size.
12+
- **multiple**
13+
When set to `false`, limits uploads to a single file.
14+
- **allowedFileExtensions**
15+
Restricts accepted file types.
16+
17+
For the complete list of configuration options, refer to the following API section: [fileUploaderOptions](/Documentation/ApiReference/UI_Components/dxChat/Configuration/#fileUploaderOptions).
18+
19+
The [Attachment](/Documentation/ApiReference/UI_Components/dxChat/Types/Attachment/) type includes `name` and `size` fields. To add custom fields (such as `url` in this demo), handle the [onMessageEntered](/Documentation/ApiReference/UI_Components/dxChat/Configuration/#onMessageEntered) event and update the message object’s [attachments](/Documentation/ApiReference/UI_Components/dxChat/Types/TextMessage/#attachments) array as needed. You can use this handler to save files to your server.
20+
21+
After a user sends a message, attachments appear in the corresponding message bubble. To allow users to download attachments, implement the [onAttachmentDownloadClick](/Documentation/ApiReference/UI_Components/dxChat/Configuration/#onAttachmentDownloadClick) event handler. You can define custom download logic within the handler.

0 commit comments

Comments
 (0)