SharePoint 2010 - Custom Toolpart properties for CQWP.

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?

1. Create a blank SharePoint project in Microsoft Visual Studio 2010 with name "CustomContentQueryWebPart".
   
2. Add a "Web Part" to the project with name "ExtendedCQWP" and not to be mistaken with "Visual Web Part".
   
   
   
3. 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.
   
   
   
4. 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
           
       }
   }
   

5. 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
       }
   }
   

6. I renamed the title in element.xml so the web part show with title "Custom Content Query Web Part".
   
   
7. Edit the newly added webpart.
   
   
   /li>
   
8. The right side of the tool pane will show like the below given picture. Make the modification as you want.
   
   
   



9. 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.