Search This Blog

Monday, June 28, 2010

Create custom SharePoint web part using Web User Control

Creating the Web Part
First Create New Project called "ProjectView" and select ASP.NET Web Application (Figure 1 & 2). Don’t use shortcuts.

Then Add new Web User Control called "ProjectViewControl" to your project (Figure 3 & 4).

Then Add reference to the “Microsoft.SharePoint.dll”. It can be found in your sharepoint server’s ISAPI folder (Figure 5 & 6).

You should copy this file along with “Microsoft.SharePoint.Search.dll” and “Microsoft.SharePoint.Search.xml” from the same directory to a directory on your local computer if you are developing your project on a machine not having SharePoint or MOSS.

Then go to your SharePoint site’s folder (You can find it in SharePoint server) and create a folder called “usercontroles” if does not exist (Figure 7).

Find your site’s “Web.config” file within the same folder and open it (Figure 7).

Then add new Class called “WebControl.cs” which inherits from “WebPart” Class to your project (Figure 8) and paste this code there.

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.IO;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebPartPages;

namespace ProjectView
public class WebControl : WebPart
protected string UserControlPath = @"~/usercontrols/";
protected string UserControlName = @"ProjectViewControl.ascx";

private ProjectViewControl mycontrol;
private string exceptions = "";

protected override void CreateChildControls()
mycontrol = (ProjectViewControl)this.Page.LoadControl(UserControlPath + UserControlName);
catch (Exception CreateChildControls_Exception)
exceptions += "CreateChildControls_Exception: " + CreateChildControls_Exception.Message;
protected override void RenderContents(HtmlTextWriter writer)
catch (Exception RenderContents_Exception)
exceptions += "RenderContents_Exception: " + RenderContents_Exception.Message;
if (exceptions.Length > 0)
There don’t forget to add following two lines to the top, now your “WebControl.cs” Class should like above.

using Microsoft.SharePoint;
using Microsoft.SharePoint.WebPartPages;

Then drag and drop a text box and two buttons to ProjectViewControl.ascx. Double click those buttons to add custom code (Figure 9 & 10).

Signing your web part project
To deploy this Web Part and Web User Control to GAC and the Microsoft Office SharePoint Server, we should assign a Strong Name key and sign the control.

To do this, right click the “ProjectView” node in Solution Explorer and select Properties. Then select the Signing tab from the choices on the left. Check the "Sign the assembly" box and select from the "Choose a strong name key file" drop down list (Figure 11).

There give a key file name and click ok. Now you can build your project and ready to deploy.
Deploying the Web Part and Web User Control
Here is deploying steps;

1. Copy the "ProjectViewControl.ascx" file to the created usercontroles folder (Figure 7).

2. Drag and drop the compiled DLL (You can find it in your project folder's bin folder) into the Global Assembly Cache. The Global Assembly Cache is a special folder located at %WINDIR%\assembly where %WINDIR% is the full path to your Windows folder (e.g. C:\Windows or C:\Winnt).

3. Get the publicKeyToken property of our assembly. You can find it by right click on the file and select properties in "assembly" folder (Figure 12).

4. Update the "Web.config file"

4.1 Insert these three lines between SafeControls tags.
1<SafeControl Assembly="ProjectView, Version=, Culture=neutral, PublicKeyToken=9a73871474819663" Namespace="ProjectView" TypeName="WebControl" Safe="True" />
2<SafeControl Assembly="ProjectView, Version=, Culture=neutral, PublicKeyToken=9a73871474819663" Namespace="ProjectView" TypeName="ProjectViewControl" Safe="True" />
3<SafeControl Assembly="ProjectView, Version=, Culture=neutral, PublicKeyToken=9a73871474819663" Namespace="ProjectView" TypeName="*" Safe="True" />

4.2 Insert this line between assemblies tags.
1<add assembly="ProjectView, Version=, Culture=neutral,PublicKeyToken=9a73871474819663" />

5. Insert new XML file called "myprojectview.webpart" (Figure 13) and paste this code.

01<?xml version=
"1.0" encoding="utf-8" ?>
03    <webPart xmlns="">
04        <metaData>
05            <type name="ProjectView.WebControl, ProjectView, Version=,Culture=neutral,PublicKeyToken=9a73871474819663" />
06            <importErrorMessage>Cannot import this Web Part.</importErrorMessage>
07        </metaData>
08        <data>
09            <properties>
10                <property name="Title" type="string">My first custom Web Part</property>
11                <property name="Description" type="string">
12                    webpart created by using web user controles
13                </property>
14                <property name="ChromeType">TitleOnly</property>
15                <property name="ChromeState">Normal</property>
16                <property name="ItemLimit" type="int">15</property>
17                <property name="ItemStyle" type="string">Default</property>
18            </properties>
19        </data>
20    </webPart>

6. Upload the "myprojectview.webpart" file to Share Point's Web Part gallery. (You should have permission to see the Site Action tab and upload) (Figure 14, 15, 17, 18 & 19)

Use your Web Part

To use your Web Part in a page, follow these steps;

1. Edit a SharePoint page (Figure 19, 20 & 21)
2. Select a zone into which you want to place your Web Part
3. Add the Web Part to the zone
4. Exit from the Edit mode

No comments:

Post a Comment