, , , , ,

In a previous article I showed how to create a multilanguage list of countries in Sitecore. Now we are going to discuss how to use this list of countries to create a country picker form field in Webforms for Marketers.

CountryPicker FormDesigner

First you create a custom field item. This should be a child of the following Sitecore node: /sitecore/system/Modules/Web Forms for Marketers/Settings/Field Types/Custom. Fill in the namespace and class name and the assembly name that you are going to use.

Now we are going to add the class, that we are going to call “DropDownCountryPicker”. This class should inherit from Sitecore.Form.Web.UI.Controls.DropList, which is present in the Sitecore.Forms.Core.dll.

This class has a public property which is decorated with the “VisualFieldType” attribute, among others. This property could be used in the Form Designer by the user. The user fills in a country name, and if this country exists in the list, its ISO code will be stored in the private variable “initiallySelectedCountry”. This variable is then used in the override of the DoRender() method to set the initial value of the DropDownList.

public class DropDownCountryPicker : Sitecore.Form.Web.UI.Controls.DropList
private string _initiallySelectedCountry;

[VisualCategory("Initial Selection")]
[VisualFieldType(typeof(TextAreaField)), Localize]
[VisualProperty("Initial Selection:", 100)]
public string InitialSelection { get; set; }

protected override void InitItems(Sitecore.Form.Web.UI.Controls.ListItemCollection items)
	this.KeepHiddenValue = false;

	items = new Sitecore.Form.Web.UI.Controls.ListItemCollection();

	SafeDictionary<string, string> dictionaryCountries = GetCountries();

	foreach (var country in dictionaryCountries)
	items.Add(new ListItem() {Value = country.Key, Text = country.Value});

		// check if initial country exists
		if (country.Value == InitialSelection)
			_initiallySelectedCountry = country.Key;

protected override void DoRender(HtmlTextWriter writer)
	if (!string.IsNullOrEmpty(_initiallySelectedCountry))
		droplist.SelectedValue = _initiallySelectedCountry;

As seen above, the countries are retrieved in the method “GetCountries();”. Now we are going to discuss this method in detail.

First we retrieve the CountryData item (as explained in the previous article) from Sitecore. You should make your own query for this, as it depends on your own Sitecore structure. Then, from this item, we read the contents of the field “CountryDataList”, which is a NameValue field. The contents in a NameValue field are stored in a querystring kind of way, so we have to cast this into a more convenient form. For this we can use the ParseQueryString() method in the WebUtil class from Sitecore, which returns a SafeDictionary. This is also what we are going to return from our method.

private SafeDictionary<string, string> GetCountries()
SafeDictionary<string, string> dictionaryCountries = new SafeDictionary<string, string>();

// make your own query here
string query = "/sitecore//*[@@templatename = CountryData']";

Item countryDataItem = Sitecore.Context.Database.SelectSingleItem(query);

dictionaryCountries = WebUtil.ParseQueryString(countryDataItem["CountryDataList"]);

return dictionaryCountries;

This is it, the country picker for Webforms for Marketers is finished. The user is able to configure the initial country selection as seen in the image at the top of this article.