SharePoint Lover

How to program a simple SharePoint web part

Web parts can be little components that can be added a SharePoint page. SharePoint already has a number of web parts that already come installed in the package (e.g. lists, calendars).

These web parts do not always meet the business needs of an end user and as such some customisation may be required to align the web part with what the business needs.

For this reason, we will create a simple web part that will ask a user to enter text and at the click of a button, the text will be displayed back to the user. We will achieve this by:

1. Using Visual Studio 2010 . Net framework to create a web project.
2. Add a Web Part
3. Add some c# code and commands to the web Part for the controls (i.e. buttons, text box and labels)
4. Build and deploy the web part
5. Add it to the page of a SharePoint site

Create a web project

For this part, we will be creating a project called QuestionsAndAnswers.

• As an administrator, Launch Visual Studio 2010
• Select File | New | Project

• Ensure you select .Net Framework 3.5 and from the templates on the left, select SharePoint 2010 and then select Empty SharePoint Project. Next enter the Name as QuestionsAndAnswers and then click on "OK".

   

• The SharePoint Customization Wizard will now be displayed. Click on validate to ensure you have connectivity, then select "Deploy as a farm solution" and then click on "finish".

   

   

   

• The project will now be created and will appear in Solution Explorer

   

Create The Web Part

• Right click on the QuestionsAndAnswer Node in the solution explorer and click on Add | New Item

   

   

   

• Click on the template called Web Part and enter the name of the web part as QuestionsAndAnswerWebPart and then click on Add.

   

   

   

   

   

• The QuestionsAndAnswersweb part .cs file will now be created and made visible. There will already exist some code of which will now need to be edited so as to perform what is required.

   

   

   

Add some code

As above, when you create the web part.cs file some program data is already included. This will now have to be written and edited with additional c# methods so as to make it perform actions.

using System;

using System.ComponentModel;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using Microsoft.SharePoint;

using Microsoft.SharePoint.WebControls;

namespace QuestionsAndAnswers.QuestionsAndAnswersWebPart

{

[ToolboxItemAttribute(false)]

public class QuestionsAndAnswersWebPart : WebPart

{

Label QuestionTitle = new Label();

Label QuestionLabel = new Label();

TextBox TheQuestionTextbox = new TextBox();

Label TheAnswerLabel = new Label();

Button TheClickButton = new Button();

protected override void CreateChildControls()

{

QuestionTitle.Text = "Question and Answers";

QuestionLabel.Text = "Enter Text:";

TheAnswerLabel.Text = "";

TheQuestionTextbox.Enabled = true;

TheQuestionTextbox.Text = "";

TheClickButton.Text = "Click";

this.Controls.Add(QuestionTitle);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(QuestionLabel);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(TheQuestionTextbox);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(TheClickButton);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(TheAnswerLabel);

TheClickButton.Click += new EventHandler(TheClickButton_Click);

}

void TheClickButton_Click(object sender, EventArgs e)

{

string userResponse = "You entered " + TheQuestionTextbox.Text;

TheAnswerLabel.Text = userResponse;

}

void TheClearButton_Click(object sender, EventArgs e)

{

TheQuestionTextbox.Text = "";

TheAnswerLabel.Text = "";

}

}

}

Build and Deploy the web part

After adding the code, ensure that there are no syntax errors.

• Right click on the Questions and Answers project node and then click Build and then deploy.

   

   

   

• Ensure it deploys with no errors i.e. it displays deployment succes

Add web part to SharePoint site

• Customised web parts appear in the SharePoint web part galleries under the node "Custom"

   

• On the SharePoint site, click on Site Actions | Edit Page | Add Web Part

   

• Select Categories | Custom | Web parts and then select the Questions and Answers Web Part and click on Add.

   

   

   

• The web part will now be added

• Enter some test data

Complete Code

using System;

using System.ComponentModel;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using Microsoft.SharePoint;

using Microsoft.SharePoint.WebControls;

namespace QuestionsAndAnswers.QuestionsAndAnswersWebPart

{

[ToolboxItemAttribute(false)]

public class QuestionsAndAnswersWebPart : WebPart

{

Label QuestionTitle = new Label();

Label QuestionLabel = new Label();

TextBox TheQuestionTextbox = new TextBox();

Label TheAnswerLabel = new Label();

Button TheClickButton = new Button();

Button TheClearButton = new Button();

protected override void CreateChildControls()

{

QuestionTitle.Text = "Question and Answers";

QuestionLabel.Text = "Please Enter some text:";

TheAnswerLabel.Text = "";

TheQuestionTextbox.Enabled = true;

TheQuestionTextbox.Text = "";

TheClickButton.Text = "Click";

TheClearButton.Text = "Clear";

this.Controls.Add(QuestionTitle);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(QuestionLabel);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(TheQuestionTextbox);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(TheClickButton);

this.Controls.Add(TheClearButton);

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(new LiteralControl("<br/>"));

this.Controls.Add(TheAnswerLabel);

TheClickButton.Click += new EventHandler(TheClickButton_Click);

TheClearButton.Click += new EventHandler(TheClearButton_Click);

}

void TheClickButton_Click(object sender, EventArgs e)

{

string userResponse = "You entered " + TheQuestionTextbox.Text;

TheAnswerLabel.Text = userResponse;

}

void TheClearButton_Click(object sender, EventArgs e)

{

TheQuestionTextbox.Text = "";

TheAnswerLabel.Text = "";

}

}

}