A lot of people are asking why the Upload Multiple Documents button is greyed out.
The reason is simple, the component used for the Upload Multiple Documents is a ActiveX which comes with the installation of Office. So if you do not have
office installed, you do not get to use this awesome feature.
In this post I’ll explain how to integrate your own Upload Multiple documents feature. This feature will be made of a Silverlight Control integrated into SharePoint.
But before starting anything, let’s create our SharePoint solution in Visual Studio 2010.
In Visual Studio 2010, create an Empty SharePoint Project.
In the same solution, create a Silverlight Project, choose not to Host the Silverlight application in a new Web site as SharePoint will do that.
We will also add a List Instance called XAPLib (for later use).
Here is the structure of the solution we have created so far.
SPMU : SharePoint project which will contain all SharePoint stuff (customization, packaging)
SPMU.Client: Silverlight project which will contain the Multiple Upload control
Now that we have our SharePoint project ready, here is in short what needs to be done:
- override the Upload Multiple Documents button to add our own and implement the logic behind our new button to call a modal dialog
- implement the Application Page that the modal dialog will host
- implement the Silverlight Control (responsible for the multiple upload) that the Application Page will host
Override the Upload Multiple Documents button
It might sound stupid but when overriding Ribbons buttons, you need first to identify the good one to override.
The definition of the Ribbon can be found in the CMDUI.xml file that you will find in the C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\GLOBAL\XML folder.
What I need to know, it’s the ID of the button that I need to override, for this purpose I open the CMDUI.xml and I will search for Multiple.
You will find, at line 4091, a button with the following ID : Ribbon.Documents.New.AddDocument.Menu.Upload.UploadMultiple -> Sounds like the good one for us.
Now that we have identify the control to override, let’s do it.
In your SharePoint project, add a new Empty Element and add the following markup in the Elements.xml
What is important in this markup, is that we use as Location, the ID we have found before : Ribbon.Documents.New.AddDocument.Menu.Upload.UploadMultiple. For the others properties, I’ve just copied-past it from the default definition that you can find in the CMDUI.xml
I’ve added a CommandUIHandler to our new button. When the user clicks on this button, it opens a Modal Dialog with the Application Page MultipleUpload.aspx.
I’ve also added another Custom Action to integrate a script block used in the EnabledScript of our CommandUIHandler. This script checks if Silverlight is installed on the computer, return true if it’s the case and so set the our Ribbon button as enable.
Application Page that the modal dialog will host : MultipleUpload.aspx
First of all, create a new Application Page called MultipleUpload.aspx into your SharePoint project.
The mapped folder Layouts will be created and the MultipleUpload.aspx page will be added inside. This page will be used as host for the Silverlight control.
Here is the code that I use in the MultipleUpload.aspx page to host the Silverlight:
The important things to look at is that I pass two initparams :
- ListId which defines the list the upload should target
- MS.SP.url which defines the client context in which the Silverlight control will be loaded, if you do not set this value, you will get a null reference for ClientContext.Current
As you can see the XAP will be stored in the XAPLib but I’ll come back on that later.
The Silverlight Control
We have created at the beginning a Silverlight Project, what we need to do now it’s to tell SharePoint what to do with the output (xap file) of this project.
For this purpose, create a new Module in your Sharepoint Project. In the elements.xml of your module add the following code:
When our solution will be deployed in SharePoint, this module will take the SLMultipleUpLoad.xap and push it in the Lists/XAPLib document library.
Further to this configuration file, we need to “link” our module with our Silverlight Project.
Click on Add, a new Member will appear and on the left, set the Deployment Type at ElementFile and in the Project Name, select your Silverlight Project.
I won’t add the code of the Silverlight Control because it’s a pretty standard code which use the Client Object Model to add the file into the current document library.
Here is how your final solution should look like:
Here you will find the Visual Studio 2010 of this project.
Don’t expect anything fancy in the Silverlight code, no MVVM, no waiting animation, no exception handling, does not support large uploads… the goal of this article was to describe how you can override a built-in feature by a Silverlight Control.
…because there is all the time some, especially with SharePoint.
These issues can be splitted in two parts:
- When a user clicks on Upload Document, the standard upload page is loaded but sill contains the link to the OOTB multiple upload page (uploadex.aspx)
- If a user does not have office installed, this link won’t appear.
So what we should do, it’s to find a way to override this page but this will be part of the Part 2 of this post.
If you have any question, feel free to let a comment.