Reading the support tickets daily it has become one of my most rewarding morning routines. Besides the constant learning factor, I am all the time running into some amazing questions / implementations/ samples that I can put in practice right away.

I have said it before but I will reiterate here:

When presented with a XAF challenge the first thing I do it is a quick search trough the support tickets to see if there is already an implementation that I can adapt to my needs. Most of the time I find something that I can use, but also most of the time I have to actually code it and run it to see if it is exactly what I need it.

If you are like me, you would love to have a visual before getting to deep and realizing I am on the wrong path. I also realize DevExpress receives tons of tickets daily so this is not feasible for them.

Well, this is one of those tickets, more specifically this one:

https://www.devexpress.com/Support/Center/Question/Details/Q408975/multiple-upload-in-xaf

Here, we need to achieve a drag and drop multiple file upload for our Web project.

You can check the source code here but it all comes down to this controller:

public class FileAttachmentsController :ObjectViewController<DetailView, Resume> 
{
       public FileAttachmentsController() 
       {
           TargetViewId = "Resume_DetailView";
       }

       protected XafCallbackManager CallbackManager 
       {
           get { return ((ICallbackManagerHolder)WebWindow.CurrentRequestPage).CallbackManager; }
       }

       protected override void OnViewControlsCreated() 
       {
           base.OnViewControlsCreated();
           ControlViewItem fileAttachmentsControl = (ControlViewItem)View.FindItem("FileAttachmentsControl");

           if (fileAttachmentsControl.Control != null)  
           {
               ASPxUploadControl uploadControl = (ASPxUploadControl)fileAttachmentsControl.Control;
               uploadControl.UploadMode = UploadControlUploadMode.Advanced;
               uploadControl.ShowUploadButton = true;
               uploadControl.AdvancedModeSettings.EnableDragAndDrop = true;
               uploadControl.AdvancedModeSettings.EnableFileList = true;
               uploadControl.AdvancedModeSettings.EnableMultiSelect = true;
               uploadControl.FilesUploadComplete += UploadControl_FilesUploadComplete;
               uploadControl.ClientSideEvents.FilesUploadStart = "function (s, e) { e.cancel = !confirm('All changes will be saved to the database. Continue?'); }";
               string callbackScript = CallbackManager.GetScript();
               uploadControl.ClientSideEvents.FilesUploadComplete = $"function(s, e) {{ {callbackScript} }}";
           }
       }

       private void UploadControl_FilesUploadComplete(object sender, FilesUploadCompleteEventArgs e) 
       {
           ASPxUploadControl uploadControl = (ASPxUploadControl)sender;

           foreach (UploadedFile uploadedFile in uploadControl.UploadedFiles) 
           {
               PortfolioFileData fileData = ObjectSpace.CreateObject<PortfolioFileData>();
               fileData.Resume = ViewCurrentObject;
               fileData.DocumentType = DocumentType.Unknown;
               fileData.File = ObjectSpace.CreateObject<FileData>();
               fileData.File.LoadFromStream(uploadedFile.FileName, uploadedFile.FileContent);
           }
           ObjectSpace.CommitChanges();
       }
   }

In the OnViewControlsCreated we configure the ASPxUploadControl to enable Drag and Drop, MultiSelect etc and in the FilesUploadComplete event we create a PortfolioFileData object for each uploaded file and that is it.

See it in action:

Until next time, XAF out!