Creating Dynamic SharePoint Help With Lists And RadToolTipManager

Using the RadToolTipManager to build dynamic help options within custom SharePoint WebParts is a really useful trick. It can greatly increase the usability of an application, and you can dynamically store the different help items in SharePoint fields. In this example I am going to dynamically expose some fields on a custom WebPart through a BaseFieldControl method, and just use the field names as keys to bind the different help items.

So let’s assume I am reflecting on a field to surface the correlating WebControl:

BaseFieldControl webControl = SPField.FieldRenderingControl;
webControl.ListId = SPList.ID;
webControl.ItemId = SPListItem.ID;
webControl.FieldName = SPField.Title;
webControl.ID = string.Format(“MyField_{0}”, SPField.Title)
webControl.ControlMode = mode;

I am going to use this static helper method for the actual tool tip and target control instantiation:

public static void CreateHelpAndAdviceButton(string fieldName, Control Parent, RadToolTipManager manager, bool show)
string buttonId = String.Format(“btn{0}”, fieldName);
ImageButton btn = new ImageButton();
btn.ImageUrl = “/_layouts/images/help.png”;
btn.Visible = show;
char[] charsToRemove = new[] {‘\r’, ‘\t’, ‘\n’, ‘ ‘, ‘:’, ‘-‘};
string[] results = String.Format(“{0}”, buttonId).Split(charsToRemove);
StringBuilder transformedString = new StringBuilder();
foreach (string s in results)
btn.ID = transformedString.ToString();
manager.TargetControls.Add(btn.ID, fieldName);

RadToolTip tip = new RadToolTip();
tip.ShowEvent = ToolTipShowEvent.OnMouseOver;
tip.TargetControlID = buttonId;
tip.IsClientID = true;
tip.ID = String.Format(“RadToolTip{0}”, buttonId);
tip.HideEvent = ToolTipHideEvent.LeaveToolTip;

The RadToolTipManager is assumed to be created, but you can just create one with a static method and pass it in. Here is a method for a pretty basic popup with delay window:

public static RadToolTipManager ConfigureTooltip()
RadToolTipManager tooltipManager = new RadToolTipManager();
tooltipManager.Position = ToolTipPosition.TopRight;
tooltipManager.Animation = ToolTipAnimation.Resize;
tooltipManager.RelativeTo = ToolTipRelativeDisplay.Mouse;
tooltipManager.ShowEvent = ToolTipShowEvent.OnMouseOver;
tooltipManager.HideEvent = ToolTipHideEvent.ManualClose;
tooltipManager.ContentScrolling = ToolTipScrolling.Default;
tooltipManager.AjaxUpdate += OnAjaxUpdate;
tooltipManager.EnableShadow = true;
tooltipManager.Width = 200;
tooltipManager.Height = 150;
tooltipManager.ShowDelay = 200;
tooltipManager.HideDelay = 1;
tooltipManager.AnimationDuration = 300;
tooltipManager.MouseTrailing = true;
tooltipManager.ShowCallout = true;
tooltipManager.Modal = false;
return tooltipManager;

The OnAjaxUpdate is responsible for the actual display of the item, so that has to be defined. Especially since it’s in the above method! This is also where we will look up to the SPList and get the relevant items. We are just using the field name as a key against the list, and a super simple SPListItem iteration.

public static void OnAjaxUpdate(object sender, ToolTipUpdateEventArgs args)
UpdateToolTip(args.Value, args.UpdatePanel);
public static void UpdateToolTip(string key, UpdatePanel panel)
foreach (SPListItem item in SPContext.Current.Web.Lists[“SomeList”].Items)
string fieldName = item[“Field Name”].ToString();
if (fieldName == key)
string content = item[“Text”].ToString();
Literal lbl = new Literal();
lbl.Text = content;

Then, just call the static helper method for the button generation:


CreateHelpAndAdviceButton(Some Field Name, ControlToAddTo, RadToolTipManager, false);