Web Part’s custom Properties in ToolPart

Its is there on my cards for long time to write on customizing Web Part’s properties. Now, finally I am writing. The basic idea behind this article is to add our own logic and controls in web part. There could be any reason for this need where in you have to add your own logic or accept certain inputs from User.

Requirements

  • SharePoint 2010 basic knowledge
  • Basic info on build and deploy SharePoint packages
  • Or you can simply download the project and use as per your need

Introduction

We will see a step-by-step tutorial for adding your own custom controls in the Web Part property pane, always we can’t rely on the standard ones. Situation may arise where in we need an advanced controls rather than using its default functionality which will not able to deliver the same. That’s where the ToolPart class comes very handy!

We will add all the available Lists (SPListCollection) in the current site in the ToolPart and add all these items in the DropDownList.

What basic thing that we can do to understand the customization part of ToolPart is populate all the lists in current site using SPListCollection in a DropDownList.

Let’s get started

First we will see the default Web Part property pane (in this case we will …)

Default-Tool-Part-Pane

Default-Tool-Part-Pane

This was very easy to get. In SharePoint 2010 site -> Edit Page -> Insert -> Web Part -> Select Web Part of your choice.

Let’s code something

  1. Launch Visual Studio 2010
  2. Create Empty SharePoint Solution
  3. Right click on project in Solution Explorer
  4. Add -> New Item -> Select “Web Part” and provide proper name (DemoWebPart in my case)

    Adding-Web-Part

    Adding-Web-Part

In DemoWebPart.cs add the properties of your choice for your web part

public string ListName
{
	get
	{
		return _listName;
	}
	set
	{
		_listName = value;
	}
}
string _listName;

public string ListValue
{
	get
	{
		return _listValue;
	}
	set
	{
		_listValue = value;
	}
}
string _listValue;

Now that we got the properties, next step is to just render their values. For that we are going to override the Render() method to display the property values that we are going to set.

protected override void Render(HtmlTextWriter writer)
{
	base.Render(writer);
	writer.Write(ListName);
	writer.Write("<br />");
	writer.Write(ListValue);
}

Okay, now its time to override the GetToolParts() method so that we can modify the web part toolpane.

public override ToolPart[] GetToolParts()
{
	ToolPart[] allToolParts = new ToolPart[3];
	WebPartToolPart standardToolParts = new WebPartToolPart();
	CustomPropertyToolPart customToolParts = new CustomPropertyToolPart();

	allToolParts[0] = standardToolParts;
	allToolParts[1] = customToolParts;
	allToolParts[2] = new CustomToolPart();

	return allToolParts;
}

This code simply creating an object of WebPartToolPart class by instantiating it, which will give us the standard toolpart. Then as we wanted we are instantiating CustomPropertyToolPart class object which adds a custom property toolpart for us. And finally we are adding our own CustomToolPart to the collection of ToolParts and then we are returning the collection – and asking SharePoint to render in mentioned order!

In order to wrap the code of our own custom tool part, we will create a class named DemoCustomToolPart.cs and we have to derive it from Microsoft.SharePoint.WebPartPages.ToolPart.

Adding-Custom-Tool-Part-Class

Adding-Custom-Tool-Part-Class

public class DemoCustomToolPart : Microsoft.SharePoint.WebPartPages.ToolPart
{
	DropDownList ddl;
	TextBox tb;

	protected override void CreateChildControls()
	{
		ddl = new DropDownList();
		ddl.ID = "ddl";

		// Simply getting the lists of the current web, and displaying them in the dropdown-list.
		SPListCollection lists = SPContext.Current.Web.Lists;
		foreach (SPList list in lists)
			ddl.Items.Add(list.Title);

		tb = new TextBox();
		tb.ID = "tb";

		Controls.Add(ddl);
		Controls.Add(tb);
		base.CreateChildControls();
	}

	public override void ApplyChanges()
	{
		DemoWebPart wp = (DemoWebPart)this.ParentToolPane.SelectedWebPart;
		wp.ListName = ddl.SelectedValue;
		wp.ListValue = tb.Text;
	}
}

The point to note here is the override of ApplyChanges in this class which basically tells WebPart (this.PartenToolPane.SelectedWebPart is DemoWebPart) that assign the values to the properties in the custom property toolpart which we have created.

It’s Show Time

First is the Custom Tool Part Property pane

Web-Part-Custom-Property-Pane

Web-Part-Custom-Property-Pane

Web part in action!

Web-Part-In-Action

Web-Part-In-Action

Download

Pretty easy isn’t it? This was just at the intro level that how you can add your own controls and handle their behavior of your WebParts.

Download VS2010 Project

Happy SharePointing 🙂

Posted in ASP.NET, Secure .NET Coding, Security, Sharepoint, Sharepoint Security Tagged with: , , ,