Just another WordPress.com site

Beginning SharePoint Web Part Development

This is the first article in a series focusing on WSS 3.0 development using Visual Studio 2008. This article is for beginners who are quite new to SharePoint web part development and want to learn about configuring WSS 3.0, developing web parts using Visual Studio 2008, deploying and publishing web parts and finally debugging a web part.

My development machine is equipped with following environment before installing any of SharePoint related software or tools:

  • Windows Server 2003 with SP1
  • IIS
  • SQL Server 2005 (comes with .NET 2.0) with SP2
  • Visual Studio 2008 (comes with .NET 3.5)
  • Office 2007

Before you start, you should have following installed on your machine:

Windows SharePoint Services 3.0 with Service Pack 1

WSS 3.0 Tools: Visual Studio 2008 Extensions v1.2

The entire source code for this article is available in the form of a free downloadable zip file. The solution was developed using Microsoft Visual Studio 2008 Team Edition on Microsoft Windows Server 2003 Standard Edition with Microsoft SQL Server 2005 Developer Edition and Windows SharePoint Services 3.0 SP1. I didn’t really test it in any other environment. I request that you post in the discussion area if you have any problems in execution.

Configuring WSS 3.0: Create Sample web site and site collection

Once you have installed WSS 3.0 and Visual Studio 2008 Extensions from the previous URLs provided, you can go through the following steps to create a sample web site and web page where our web parts can be tested.

NOTE: Once WSS is installed, the default web site (in IIS) gets stopped and the WSS web site runs on port 80 of IIS.

  • Go to http://localhost/default.aspx.
  • Go to Site Actions || Create
  • Select “Sites and Workspaces.”
  • In the “New Sharepoint Site” page, provide the Title, Description and URL name as follows, select “Blank Site” as the template and finally hit  “Create.”
  • Once new web site gets created, go to the web site and go to Site Actions || Create.
  • Select “Document Library.”
  • Provide details for the new document library as follows,and create it.

Configuring WSS 3.0: Create a web part web page

So far, we’ve created a new WSS site and document library. In this section we will create a web part page.

  • Once the new site collection gets created, go to that site collection and click on Site Actions || Create.
  • Select “Web Part Page.”
  • In the “Create New Web Part” page, provide details as follows.
  • Finally, you should land on the following page.

Beginning SharePoint Web Part Development – Developing your first WSS 3.0 web part using Visual Studio 2008 extensions

Go through the following steps for creating a new Sharepoint web part using Visual Studio 2008.

  • Open Visual Studio 2008.
  • Go to File || New Project.
  • In the “New Project” dialog, select Visual Basic || Sharepoint, “Web part” template and provide the name “TestSPWebPart.”
  • In the project properties, go to the “Debug” tab and provide http://localhost/testsite.
  • Modify the web part code so that it looks like the following:

Public Class WebPart1

Inherits System.Web.UI.WebControls.WebParts.WebPart

Public Sub New()

End Sub

Protected Overrides Sub CreateChildControls()

MyBase.CreateChildControls()

‘TODO: add custom rendering code here.

Dim label As New Label()

label.Text = “Hello World”

Me.Controls.Add(label)

End Sub

End Class

From the above, you must understand that our custom web parts are being inherited from the “System.Web.UI.WebControls.WebParts.WebPart” namespace. Unfortunately, there is no designer support in Visual Studio 2005/2008 for developing SharePoint web parts. Everything must be coded and developed in the same manner as an ASP.NET custom control.

Deploying and publishing a sample web part in WSS 3.0

Visual Studio 2008 has built-in support to deploy web parts directly to a WSS 3.0 site. This integrated approach saves lots of development time and also helps us to debug web parts very easily. Debugging web parts is covered in the last section of this article.

The following steps continue from where we left off.

  • Using Solution Explorer, right click on project and select “Deploy” as follows.
  • Open the Sharepoint Web Part page as shown below.
  • Change the mode to “Edit” by selecting Site Actions || Edit Page.
  • Click on “Add Web Part” as follows.
  • Select the deployed web part as shown below,and click “Add.”
  • Finally, the web part must be shown as in the image below.

You must note that once a web part is deployed, the IIS gets restarted. This happens every time a web part is deployed using Visual Studio 2008.

The previous web part is a very simple web part which displays a simple message. Let us modify the previous web part to display two labels, two text boxes and a button in a table. Once the user clicks on the button, it should multiply both numbers and give the result in a new label.

Modify your code in the web part so that it looks similar to the following:

Option Explicit On

Option Strict On

Imports System

Imports System.Runtime.InteropServices

Imports System.Web.UI

Imports System.Web.UI.WebControls

Imports System.Web.UI.WebControls.WebParts

Imports System.Xml.Serialization

Imports Microsoft.SharePoint

Imports Microsoft.SharePoint.WebControls

Imports Microsoft.SharePoint.WebPartPages

Imports System.Data

Imports System.Data.SqlClient

Namespace TestWebPart

<Guid(“68324554-9734-4813-958f-9301bcc7fe19”)> _

Public Class WebPart1

Inherits System.Web.UI.WebControls.WebParts.WebPart

Public Sub New()

End Sub

Protected Overrides Sub CreateChildControls()

MyBase.CreateChildControls()

Dim tbl As New Table

Dim tRow1 As New TableRow

Dim tRow2 As New TableRow

Dim tRow3 As New TableRow

Dim tR1C1 As New TableCell

Dim tR1C2 As New TableCell

Dim tR2C1 As New TableCell

Dim tR2C2 As New TableCell

Dim tR3C1 As New TableCell

Dim tR3C2 As New TableCell

tRow1.Cells.Add(tR1C1)

tRow1.Cells.Add(tR1C2)

tRow2.Cells.Add(tR2C1)

tRow2.Cells.Add(tR2C2)

tRow3.Cells.Add(tR3C1)

tRow3.Cells.Add(tR3C2)

tbl.Rows.Add(tRow1)

tbl.Rows.Add(tRow2)

tbl.Rows.Add(tRow3)

Dim txtFirst As New TextBox

txtFirst.ID = “txtFirst”

Dim txtSecond As New TextBox

txtSecond.ID = “txtSecond”

Dim lblFirst As New Label

lblFirst.Text = “Enter first:”

Dim lblSecond As New Label

lblSecond.Text = “Enter second:”

Dim lblResult As New Label

lblResult.ID = “lblResult”

Dim btnSubmit As New Button

btnSubmit.Text = “Submit”

AddHandler btnSubmit.Click, AddressOf btnSubmit_click

tR1C1.Controls.Add(lblFirst)

tR1C2.Controls.Add(txtFirst)

tR2C1.Controls.Add(lblSecond)

tR2C2.Controls.Add(txtSecond)

tR3C1.Controls.Add(btnSubmit)

tR3C2.Controls.Add(lblResult)

Me.Controls.Add(tbl)

End Sub

Private Sub btnSubmit_Click(ByVal sender As Object, ByVal e As EventArgs)

Dim i As Integer = CInt(CType(Me.FindControl(“txtFirst”), TextBox).Text)

Dim j As Integer = CInt(CType(Me.FindControl(“txtSecond”), TextBox).Text)

CType(Me.FindControl(“lblResult”), Label).Text = “Product = ” & CStr(i * j)

End Sub

Public Overrides ReadOnly Property Controls() As System.Web.UI.ControlCollection

Get

EnsureChildControls()

Return MyBase.Controls

End Get

End Property

End Class

End Namespace

Beginning SharePoint Web Part Development – A better web part with event handling: explanation

As Visual Studio 2008 doesn’t support a designer for developing Sharepoint web parts, we have to create all controls from scratch. We need to create a table having three rows with two columns (to hold six controls). Each of those controls must be added to each of those cells. Finally, the table must be added to page. The following explains how to do this in a step by step manner.

The first step is to create a table to hold all the controls. The following code does the same:

Dim tbl As New Table

Dim tRow1 As New TableRow

Dim tRow2 As New TableRow

Dim tRow3 As New TableRow

The above code creates a new table with three rows (rows are not added to table yet). Next, we need to create cells for each row.

Dim tR1C1 As New TableCell

Dim tR1C2 As New TableCell

Dim tR2C1 As New TableCell

Dim tR2C2 As New TableCell

Dim tR3C1 As New TableCell

Dim tR3C2 As New TableCell

Now we add the cells to their respective rows:

tRow1.Cells.Add(tR1C1)

tRow1.Cells.Add(tR1C2)

tRow2.Cells.Add(tR2C1)

tRow2.Cells.Add(tR2C2)

tRow3.Cells.Add(tR3C1)

tRow3.Cells.Add(tR3C2)

Then we add the rows to the table:

tbl.Rows.Add(tRow1)

tbl.Rows.Add(tRow2)

tbl.Rows.Add(tRow3)

Next, we create instances of the controls, provide values to properties and add event handlers (if any):

Dim txtFirst As New TextBox

txtFirst.ID = “txtFirst”

Dim txtSecond As New TextBox

txtSecond.ID = “txtSecond”

Dim lblFirst As New Label

lblFirst.Text = “Enter first:”

Dim lblSecond As New Label

lblSecond.Text = “Enter second:”

Dim lblResult As New Label

lblResult.ID = “lblResult”

Dim btnSubmit As New Button

btnSubmit.Text = “Submit”

AddHandler btnSubmit.Click, AddressOf btnSubmit_click

Now we add controls to their respective cells:

tR1C1.Controls.Add(lblFirst)

tR1C2.Controls.Add(txtFirst)

tR2C1.Controls.Add(lblSecond)

tR2C2.Controls.Add(txtSecond)

tR3C1.Controls.Add(btnSubmit)

tR3C2.Controls.Add(lblResult)

Finally, we add the table to a page (say, web part):

Me.Controls.Add(tbl)

The output of the web part should look like the following image:

Beginning SharePoint Web Part Development – Debugging a WSS 3.0 web part using Visual Studio 2008

In some situations, it will be necessary to debug a web part. In order to make a WSS web part able to be debugged, the web.config of the WSS web site must be modified. The default location of the WSS 3.0 web site will be installed in the following folder:

Open the Web.config file and modify the existing options to look like the following:

<SafeMode MaxControls=”200″ CallStack=”true” DirectFileDependencies=”10″ TotalFileDependencies=”50″ AllowPageLevelTrace=”false”>

<PageParserPaths>

</PageParserPaths>

</SafeMode>

<customErrors mode=”Off” />

<compilation batch=”false” debug=”true”>

Once the web.config is modified, you can directly hit F5 in a Visual Studio environment. If a break point is provided for a line in a button click event, it should stop at the same location, similar to the following:

In this article, we have seen simple SharePoint web part development using Visual Studio 2008 and WSS 3.0. In my upcoming articles, we will see more and more examples of SharePoint development. I hope you enjoyed the article and any suggestions, bugs, errors, enhancements etc

Leave a comment