Tuesday, May 25, 2010

SharePoint 2010 Visual Web Part

This is a tutorial to develop a simple Visual Web Part for SharePoint 2010.

Open Visual Studio 2010
From the menu, select File --> New Project.
In the New Project dialog window, choose Visual C# --> SharePoint 2010.
Select Visual Web Part from the Project Items.

Give your project an appropriate name. I used "WPHello2010".
Click on OK to proceed.

In the SharePoint Customization Wizard, provide the url of the SharePoint 2010 site on which you want to deploy your web part and set the trust level to "Deploy as a farm solution".
I will in another blog explain sandboxed solutions. It is also possible to change the settings later (see the new ShrePoint tab in your Visual Studio Project Properties dialog - later in this tutorial)
Click on 'Finish' to allow Visual Studio to generate the project.

When VS2010 is done with generating the project files open the solution explorer pane and check out the new files which was automatically generated. This is a great improvement from the VS2007 way constructing a deployable web part solution !

You will see that a Feature was generated, a Pacakge was generated and a Visual Web Part was also generated.

In the Solution Explorer, select the project and view the properties in the Properties pane. You will see that you can set the "Active Deployment Configuration". This setting will allow you to control the actions which gets executed when you deploy your web part from within Visual Studion. In a step below I will show how to setup your own custom actions profiles.
You will also see that you can set the Assembly Deployment Target. This is a great way to ensure that you assemblies are directly deployed to the GAC instead of the bin folder.
The Sandboxed solution is set to false - I will explain in another post.
The Site URL is the target SP2010 site where your solution (web part feature) will be deployed to.

You will also notice the VisualWebPartUserControl.ascx which was automatically added.
Lets explore the new VS2010 Project Properties Dialog. (for information only)
You will see that a new "SharePoint" tab is now available - jipeee !!
On this tab you can setup and select a "Active Deployment Configuration" (ADC)
The selected ADC can contain a number of steps which gets executed in a specific order to control deployment and retraction of the solution.

If you select an existing configuration and click on "View" you will see which available actions have been selected for deployment and retraction within this action set.
This means that I can select an existing action set or create my own custom action sets. I can then specify which action set my solution must use during deployment and retraction.

One important thing to remember is that in SP2010 Beta, you cannot use the .Net framework 4.0. So please ensure that your solution targets the .Net framework 3.5
OK, so lets get back to our web part development for SharePoint 2010.
In the solution explorer, select the VisualWebPart1.webpart file and click on code view.
Change the properties of "Title" and "Description" to something more meaningful.
Switch to design view and add controls to your usercontrol.
I added a Button and a Label.

Double-click on the button to view the Button1_Click method... (please ignore my lack of good naming conventions !)
Add a bit of code to the Button1_Click event. I added code to change the Label1.Text value.

In the solution explorer right click on the project and select "Build". After the build was successful right click on the project again and now select "Deploy".

If your project's "Active Deployment Configuration" was set to "default" the solution should be deployed to the target SP2010 site and the feature should be activated by default.

This means that you can open your SP2010 site (or refresh) and edit the default page.

Select "Insert" and then "Web Part".
In the "Categories" list you will now see a "Custom" folder.
When you select the "Custom" folder you will see your new developed visual web part.
Double click on the web part to add it onto the page.

If you now click on the button in the visual web part you will notice that the label changes.

 There we go... we have successfully developed a very simple Visual Web Part for SharePoint 2010 !!!

Enjoy !!


DFelix said...

I`m getting a error while deploying...
Error occurred in deployment step 'Activate Features': Feature with Id '9c0259ba-34b1-440b-951b-126494c924d7' is not installed in this farm, and cannot be added to this scope.

Anonymous said...

Awesome!! thanks!!!


i'm getting the following error while deploying from the front end servers

Error 1 Error occurred in deployment step 'Activate Features': Feature with Id '03e31160-73ed-41c2-84f4-2aa530c04a62' is not installed in this farm, and cannot be added to this scope.

Anonymous said...

I was looking for solution and I found it HERE!!!! Thanx

Post a Comment