It is easy to add a single file upload button in the MDriven Designer, but to handle multiple files you'll have to create a component.

Model for this example

The model for the example is a project with some documents. Each document holds the file (a blob) and a filename (a string). The goal is to make it possible to choose several documents in the file browser and upload all of them.

Setting up the ViewModel

• Create a view model. It should have a root, which in this case should be a project. The project holds the list / container of documents. We will need the ID of the view model class.
• Create a variable (here named vUploadFileTarget). It should be of a type that could store a file (blob). In this example we choose the Document type. This variable will be used to temporary store each file since we are limited to one single upload at a time.

• Add a generic view model column named AttachmentUploadTarget with the value of the file part of your variable (here vUploadFileTarget.File). The name here will be used in the component code. We create a view model column to be able to handle it in the component client code.
• Add a generic view model column named AttachmentUploadTarget_FileName with the value of the string part of your variable (here vUploadFileTarget.FileName). The _FileName suffix is important since there is a MDriven "magic" that, when uploading a file, will look for a column with the same name as referenced but with a "_FileName" suffix and if such a column exists it will assign the filename to it. Thus, this part is optional, but if you skip it you will lose the name of the file.
• Set Visible Expression to false for these columns. They are only for temporary storage.

• Add a generic view model column, with a name of your choice, for uploading (it will be a button).
• Check the Content override checkbox. This is the column that will use our own component.
• Click the TV and Attributes button, which will open a dialogue where you can set up the usage of your own external component.

• Add a Angular_Ext_Component tagged value.' The value part is here multifiles. This is the name of your component and this name is matched to the name of your component folder, and all the component files. If you mess this name up, nothing will work. If you want to copy the component code from this example (below) you should write multifiles. If you want to write your own component, please choose whatever name you like, and if you're up for a real adventure you can even try to use uppercase letters and camel case naming.