Goal
Adding custom fields in the tool pane of Content Query Web Part and using them. A few days ago I was working on a project with a similar requirement. I figured out that we can extend ToolPane and add custom controls to it.
How to achieve?
- Create a blank SharePoint project in Microsoft Visual Studio 2010 with name "CustomContentQueryWebPart".
- Add a "Web Part" to the project with name "ExtendedCQWP" and not to be mistaken with "Visual Web Part".
- Added a class "ExtendedCQWPToolPart" for the ToolPane in a folder name "CustomToolPart". Once the classes are added the structure of the project will look like the picture given below.
- Use the code for "ExtendedCQWPToolPart".
#region System
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web.UI.WebControls;
#endregion
namespace CustomContentQueryWebPart.CustomToolPart
{
/// <summary>
/// The extended tool part of Extended Content Query Web Part.
/// Will have a DropdownList, RadioButtonList and TextBox
/// Will use the values added in the controls as applied.
/// </summary>
public class ExtendedCQWPToolPart : Microsoft.SharePoint.WebPartPages.ToolPart
{
#region Properties
/// <summary>
/// Literal
/// </summary>
protected Literal Ltrl { get; set; }
/// <summary>
/// Text Box
/// </summary>
protected TextBox Txt { get; set; }
/// <summary>
/// Dropdownlist
/// </summary>
protected DropDownList Ddl { get; set; }
/// <summary>
/// Radiobutton
/// </summary>
protected RadioButtonList Rbtnl { get; set; }
#endregion
#region Methods
/// <summary>
/// Constructor
/// Applies the settings
/// </summary>
public ExtendedCQWPToolPart(string _ddlValue, string _rbtnValue, string _txtValue)
{
//Bind the ddl
Ddl = new DropDownList();
Ddl.Items.Insert(0, new ListItem("--- Select ---", ""));
Ddl.Items.Insert(1, new ListItem("DDL 1"));
Ddl.Items.Insert(2, new ListItem("DDL 2"));
Ddl.Items.Insert(3, new ListItem("DDL 3"));
//Radio Button the ddl
Rbtnl = new RadioButtonList();
Rbtnl.Items.Insert(0, new ListItem("RBTN 1"));
Rbtnl.Items.Insert(1, new ListItem("RBTN 2"));
Rbtnl.Items.Insert(2, new ListItem("RBTN 3"));
Rbtnl.SelectedIndex = 0;
//Text box
Txt = new TextBox();
//Refill the settings
if (!string.IsNullOrEmpty(_ddlValue))
{
Ddl.SelectedValue = _ddlValue;
}
if (!string.IsNullOrEmpty(_rbtnValue))
{
Rbtnl.SelectedValue = _rbtnValue;
}
if (!string.IsNullOrEmpty(_txtValue))
{
Txt.Text = _txtValue;
}
}
/// <summary>
/// Applies the child controls
/// </summary>
protected override void CreateChildControls()
{
base.CreateChildControls();
#region Add the controls to the section
//Title to the web part
this.Title = "Extended Settings";
//Add the contorls so that they show up on the screen
Ltrl = new Literal();
Ltrl.Text = "<b>Dropdown Selection</b><br /><br />";
this.Controls.Add(Ltrl);
this.Controls.Add(Ddl);
Ltrl = new Literal();
Ltrl.Text = "<br /><br /><b>Radiobutton Selection</b><br /><br />";
this.Controls.Add(Ltrl);
this.Controls.Add(Rbtnl);
Ltrl = new Literal();
Ltrl.Text = "<br /><br /><b>Textbox</b><br /><br />";
this.Controls.Add(Ltrl);
this.Controls.Add(Txt);
Ltrl = new Literal();
Ltrl.Text = "<br /><br />";
this.Controls.Add(Ltrl);
#endregion
}
/// <summary>
/// Fires on the OK/Save is clicked in the tool part pane
/// </summary>
public override void ApplyChanges()
{
base.ApplyChanges();
//Applies the custom settings to the content query web part
ExtendedCQWP.ExtendedCQWP _parentWebPart = (ExtendedCQWP.ExtendedCQWP)this.ParentToolPane.SelectedWebPart;
if (_parentWebPart != null)
{
//Applies the control settings
_parentWebPart.DdlValue = Ddl.SelectedValue;
_parentWebPart.RbtnlValue = Rbtnl.SelectedValue;
_parentWebPart.TxtValue = Txt.Text;
//Applies the settings
_parentWebPart.ApplyChanges();
}
}
#endregion
}
}
- For "ExtendedCQWP" add a reference of Microsoft.Sharepoint.Publishing and the code is given below.
#region System
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;
using System.Collections.Generic;
using Microsoft.SharePoint.WebPartPages;
#endregion
namespace CustomContentQueryWebPart.ExtendedCQWP
{
/// <summary>
/// Sample extended Content Query Web Part
/// </summary>
[ToolboxItemAttribute(false)]
public class ExtendedCQWP : Microsoft.SharePoint.Publishing.WebControls.ContentByQueryWebPart
{
#region Properties
/// <summary>
/// Txt Value
/// </summary>
public string TxtValue { get; set; }
/// <summary>
/// Radio button Value
/// </summary>
public string RbtnlValue { get; set; }
/// <summary>
/// Txt Value
/// </summary>
public string DdlValue { get; set; }
#endregion
#region Methods
/// <summary>
/// Create Child Controls
/// </summary>
protected override void CreateChildControls()
{
base.CreateChildControls();
}
/// <summary>
/// Override the get tool part
/// </summary>
/// <returns></returns>
public override ToolPart[] GetToolParts()
{
List<ToolPart> _toolParts = new List<ToolPart>(base.GetToolParts());
_toolParts.Insert(0, new CustomToolPart.ExtendedCQWPToolPart(DdlValue, RbtnlValue, TxtValue));
return _toolParts.ToArray();
}
/// <summary>
/// Applies the changes
/// </summary>
public void ApplyChanges()
{
this.Title = string.Format("DDL : {0}, Rbtn : {1}, Txt : {2}", DdlValue, RbtnlValue, TxtValue);
}
#endregion
}
}
- I renamed the title in element.xml so the web part show with title "Custom Content Query Web Part".
- Edit the newly added webpart.
/li>
- The right side of the tool pane will show like the below given picture. Make the modification as you want.
- On applying or saving the settings my code will set the title concatenating all the 3 values.
This was the simplest way of showing how to add the custom parameters in the tool pane. We can do many more things with it not just setting the title. You can also go through one of my old blog
Override Content Query Webpart to do on the run filteration to get an idea of what else can be done with extending the classes.
Hope the blog helped you, please comment if you have any queries. I will be very much happy to answer them.