Tuesday 12 June 2007

Custom property of Webpart - dynamic DropDownList

Custom properties can be included directly by including the properties (GET-SET accessor) in the web part class. Based on the return data type of the property, corresponding UI control will be rendered at run time.
Ex. If there is a property in webpart class as below

private string columnName = “”;

[WebBrowsable(true),
Personalizable(true),
Category("Web Part Settings"),
DisplayName("Site Column name."),
WebDisplayName("Site Column name."),
WebDescription("Site Column name.")]
public string ColumnName
{
get { return columnName; }
set { columnName = value; }
}


Note: WebBrowsable and Personalizable attributes should be true.
Above property will be rendered as text box on the property pane.

To display dropdown list if values are static, create a enum containing all static values and use that enum in the get-set method.
Ex:

public enum searchscope
{
All_Sites,
Current_Site
}


private searchscope searchScope = searchscope.All_Sites;
[WebBrowsable(true),
Personalizable(true),
Category("Web Part Settings"),
DisplayName("Search scope."),
WebDisplayName("Search scope."),
WebDescription("Detirmines the scope to search.")]


public searchscope SearchScope
{
get { return searchScope; }
set
{
searchScope = value;
}
}


The above code will diplay a dropdown list with two static values.

Ok, what we have to do if the values are to be dynamically read from sharepoint list or some other source.
1. Create a class that inherit from Microsoft.SharePoint.WebPartPages.ToolPart
2. Create and initialise DropDownList
3. Add the drop down list to the Controls in the overridden method CreateChildControls.
4. Override ApplyChanges() method to update the value in the main webpart class.

class CustomToolPart : ToolPart
{
DropDownList ddlTypes = new DropDownList();
:
:

public CustomToolPart()//Constructor
{
this.Title = "Select Type";//Set the title for our custom tool part.
}
protected override void CreateChildControls()
{
PopulatePageTypes(); //Method to populate the drop down list.
Controls.Add(ddlTypes);
}
public override void ApplyChanges()
{
//Logic to update the variable value in main webpart class
}
}

Now in the main web part class,
1. Override GetToolParts() method
2. Create and initialise our custom class.
3. Add to ToolParts array.

public override ToolPart[] GetToolParts()
{
ToolPart[] toolparts = new ToolPart[3];
WebPartToolPart wptp = new WebPartToolPart(); //WebPart's default properties
CustomPropertyToolPart cptp = new CustomPropertyToolPart(); //Standard Custom properties added to webpart like ColumnName and SearchScope.
CustomToolPart ctp = new CustomToolPart(); // Our custom property ToolPart

toolparts[0] = wptp;
toolparts[1] = cptp;
toolparts[2] = ctp;

return toolparts;
}

That’s all. Deploy the webpart and you can see the dropdown list with dynamic values when you modify the properties of the webpart.

18 comments:

Ishai Sagi [SharePoint MVP] said...

good tip! any chance of an RSS link?

Muthu Kumaran said...

Thanks for the Comment Ishai. Will add RSS link soon.

Anonymous said...

Where do I override GetToolParts()?

I have a web part which inherits from system.web.ui.webcontrols.webparts.webpart
and cann't override this menthod.

Muthu Kumaran said...

GetToolParts() is method of Microsoft.SharePoint.WebPartPages.WebPart class. Your webpart need to inherit from Microsoft.SharePoint.WebPartPages.WebPart class.

Anonymous said...

Great walkthrough!

Would you please expand on the ApplyChanges()?

Anonymous said...

Hi Muhtu,

It's really a nice article exactly what I was looking for. I'm creating a webpart using a usercontrol and rendering the usercontrol in a webpart class.How can I send the values of the dropdown to the usecontrol.

Anonymous said...

Nice blog - it helped me a lot - MOSS is not always so obvious :)

Just a small comment to you overridden GetToolParts. You can take advantage of the base class, like this:

public override ToolPart[] GetToolParts()
{
List<ToolPart> tools = new List<ToolPart>(base.GetToolParts());
tools.Add(new ControlDropDownToolPart(this));
return tools.ToArray();
}

To Greg:
From MSDN library;
(ApplyChanges) Called when the user clicks the OK or the Apply button in the tool pane.

So you should probably use the method to set a property or similar in the Web Part, so the web part can use the value of the ddl.. Hope this helps!

Anonymous: You can use the described approach to achieve what you want - that's exactly what I did :)

NEO said...

Any idea on how to do this in ASP.NET Web Part?

Can we have a dynamic drop down list in an ASP.NET Web Part?

RupaliK said...

Firstly for a asp.net webpart instead of creating separate Toopart webpart, we should create webpart inheriting from EditorPart.

And Secondly, We can use
public override EditorPartCollection CreateEditorParts(){
}
method instead of
public override ToolPart[] GetToolParts()
{
}
to specify all custom editor webparts.

Few links:
http://www.sharepointblogs.com/tonstegeman/archive/2007/08/04/creating-custom-editor-parts-for-a-sharepoint-webpart.aspx
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.webparts.editorpart.aspx

Bob C said...

Thanks for the great post. I'll note this as a resource on some of the related msdn pages.

IT Pro said...

How do you get the value from the property after you create. For instance, I've created a drop down that has the relative URLs for all the sites in the site collection. How do I access that value to use it to determine which site the web part gets information I need from?

Dinos K. said...

Excellent post, it works... but:

I have trouble storing the user selection in the main web part attributes from the ToolPart ApplyChanges() method... how do I do dat?

Ben Steinwand said...

I have the same question as Theoretical: How do you get the value from the property after you create. I've created a drop down but I cannot read the selected value

Pradeep said...

Hi Muthu,

Nice blog.
It helped me much.


Thanks & Regards
Pradeep

Web Designers said...

What great timing since I am having difficulty with putting drop down list on my website. When I read this post, I was then given an idea on how to solve this problem that I am having on my website...

Anonymous said...
This comment has been removed by a blog administrator.
Unknown said...
This comment has been removed by the author.
Unknown said...

Hi
There is no GetToolParts () no Suitable method found to overriding
It would be nice if there was a project you could download.
Regards Chris