Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Build a Countries List with Telerik UI for WinForms

DZone 's Guide to

Build a Countries List with Telerik UI for WinForms

In this blog post, you will learn more about the DomainUpDown control in Telerik UI for WinForms and how to use it to build a selection list for countries.

· Web Dev Zone ·
Free Resource

RadDomainUpDown in Telerik UI for WinForms is a combination of a text-box and a pair of moving up and down buttons to navigate through a limited selection of options. This control may save you some screen space since it occupies the space needed for a standard text-box. However, in addition, it allows the end user to select one of a variety of several items.

A common use-case is to build an input form for filling personal information. One of the required fields is the nationality. RadDomainUpDown is suitable for introducing the countries options if you don't want to allocate a lot of space on the form.

Adding Countries to the DomainUpDown Control

You can add the country items either at design time or at run time.

Adding Items at Design Time

The RadListDataItem Collection Editor allows you to do that. You can access it through the Smart tag >> Edit Items option:

Adding Items at Run Time

For each country option, add a RadListDataItem to the Items collection that RadDomainUpDown offers:

RadListDataItem item1 = new RadListDataItem("Bulgaria");
RadListDataItem item2 = new RadListDataItem("France");
RadListDataItem item3 = new RadListDataItem("Italy");
this.radDomainUpDown1.Items.AddRange(new List<RadListDataItem>()
 
{
    item1,
    item2,
    item3
});

Adding Flags to the Countries

Open the project's Resources and add the flags for the countries that you have added:

Adding Country Flags at Design Time

Open the RadListDataItem Collection Editor again and assign an image to each RadListDataItem:

Adding Country Flags at Run Time

Set the Image property for each RadListDataItem:

item1.Image = Properties.Resources.BUL;
item2.Image = Properties.Resources.FR;
item3.Image = Properties.Resources.ITA;

The last thing to do is to set the ReadOnly property to true. Thus, the item's image will be shown next to the text after making a selection:

Wrapping Items

Set the Wrap property to true if you need the selected item to revert to the first item after reaching the last item and vice versa.

Data Validating

The SelectedIndexChanging event allows you to control whether the newly selected item is valid according to the other fields' input, e.g. selected town. If the selection is not valid simply set the Cancel argument to true:

private void radDomainUpDown1_SelectedIndexChanging(object sender,
    Telerik.WinControls.UI.Data.PositionChangingCancelEventArgs e)
{
    if (e.Position>-1 && this.radDomainUpDown1.Items[e.Position].Text=="Italy")
    {
        e.Cancel = true;
    }
}

Try It Out and Share Your Feedback

You can learn more about the Telerik UI for WinForms suite via the product page. It comes with a 30-day free trial, giving you some time to explore the toolkit and consider using it for your current or upcoming WinForms development.

Topics:
web dev ,front-end development ,ui development ,web application development ,tutorial

Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}