Blogs

The One With

Silverlight Upload Control – v2010 vol 1

     

With DXperience v2010.1 we are introducing a couple of new Silverlight only controls. One of them is a long requested Upload Control

Silverlight Upload Control

The Upload Control will provide a rich UI for adding and removing files, and a progress indicator where you can suspend or resume the upload operations.

Working with the Upload Control

To get started, we will need to reference the DevExpress.Xpf.Controls.v10.1. The control itself lives is in the DevExpress.Xpf.Controls namespace we can reference it in XAML using the new namespace prefix xmlns:controls=http://schemas.devexpress.com/winfx/2008/xaml/controls.

<controls:UploadControl 
WebHandlerUri="http://localhost:62025/upload">
</controls:UploadControl>

The most important property that we need to set is WebHandlerUri. It should point to an HTTP handler that can process HTTP POST requests. By default, the UploadControl uses the HttpWebRequestUploadService to post data to the server, which internally uses System.Net.HttpWebRequest.

When the data is posted to the server, HttpWebRequestUploadService will decorate the URI with following query parameters:

  • fileName: The name of the file as it appears on the client side
  • packageCount: Total number of packages that are being uploaded. (UploadControl splits the file added into packages.)
  • packageNumber: Index in into the package for that file.

If you are using ASP.NET, you might implement an IHttpHandler to handle the upload requests. Here is a small example of an IHttpHandler that receives files from the UploadControl into a “Received Files” folder.

public class UploadHandler : IHttpHandler {
const string filePath = "~/Received Files";

public bool IsReusable { get { return false; } }

string GetServerPath(HttpServerUtility server, string fileName) {
return server.MapPath(Path.Combine(filePath, Path.GetFileName(fileName)));
}

public void ProcessRequest(HttpContext context) {
string clientFileName = Uri.UnescapeDataString(context.Request.QueryString["fileName"]);
string serverFileName = GetServerPath(context.Server, clientFileName);

int packageCount = int.Parse(context.Request.QueryString["packageCount"]);
int packageNumber = int.Parse(context.Request.QueryString["packageNumber"]);

string serverPath = Path.GetDirectoryName(serverFileName);
if (!Directory.Exists(serverPath)) {
Directory.CreateDirectory(serverPath);
}

FileMode fileMode = (File.Exists(serverFileName) && packageNumber > 0) ?
FileMode.Append : FileMode.Create;

using (BinaryReader reader = new BinaryReader(context.Request.InputStream)) {
using (BinaryWriter writer = new BinaryWriter(File.Open(serverFileName, fileMode))) {
byte[] buffer = new byte[4096];
int bytesRead;
while ((bytesRead = reader.Read(buffer, 0, buffer.Length)) != 0)
writer.Write(buffer, 0, bytesRead);
}
}
}
}

Cheers,

Azret

Published Apr 08 2010, 12:03 PM by Azret Botash (DevExpress)
Technorati tags: v2010.1, UploadControl, Silverlight
Bookmark and Share

Comments

 

Chris Walsh [DX-Squad] said:

Azret,

Does this control in OOB support dragging files onto it?

April 9, 2010 12:30 AM
 

Toni Wenzel said:

Does this control provide "normal" HTML file upload compatibilty so I can use this with an PHP backend?

April 9, 2010 5:06 AM
 

Azret Botash (DevExpress) said:

@Chris: I don't think there is a need for the control to handle that auto-magically. You can accept files via Drop event :

Set the AllowDrop="True":

       private void UploadControl_Drop(object sender, DragEventArgs e) {

           if (e.Data != null) {

               FileInfo[] files = e.Data.GetData(DataFormats.FileDrop) as FileInfo[];

               foreach (FileInfo file in files) {

                   uploadControl.AddFile(file.Name, file.OpenRead());

               }

           }

       }

April 9, 2010 12:30 PM
 

Azret Botash (DevExpress) said:

@Toni: The default format is

POST uri?fileName=s&packageNumber=n&packageCount=c

<PayLoad>

You can handle that in the PHP backend.

If you have a specific "normal" PHP format in mind please email me directly...

April 9, 2010 12:33 PM
 

Chris Walsh [DX-Squad] said:

That is what I had it working with Azret.  Handled the Drop event.  Great work guys...

April 9, 2010 9:19 PM
More from DevExpress
Live Chat
Have a pre-sales question?
Need assistance with your evaluation?
We are here to help.
Chat is one of the many ways you can contact members of the DevExpress Team. We are available Monday-Friday between 8:30am and 5:00pm Pacific Time.
If you need additional product information, require pre-sales assistance, or want help with your order, write to us at info@devexpress.com or call us at
+1 (818) 844-3383.