How to manage multiple linked/dependent databound drop-down lists containing default empty value

Process Design Form Designer
1

Overview

When using linked/dependent databound drop-down lists, if you want the dependent drop-down lists to select a default empty value (e.g. Select an item...) instead of the first item from the data source whenever the parent drop-down list value is changed, then a recommended solution would be to manage the empty value item via the ASP.NET code-behind.

However, adding an empty value item using the Append data bound items option and disabling the EnableViewState in the custom attributes within the drop-down lists is not a viable solution, because when a page post-back event happens, the drop-down lists would lose their selected value since their viewstates are no longer managed at the page level.

The solution and a sample process are found below.

Solution

Step one

Add or update a Page_Init method that will add a new custom databound event to the lists at one of the first steps of the page cycle.

protected void Page_Init(object sender, EventArgs e)
{
    REQUEST_COUNTRY.DataBound += Country_Databound;
    REQUEST_STATE.DataBound += State_DataBound;
    REQUEST_CITY.DataBound += City_Databound;
}

Step two

You will need to create all the databound methods mentioned in step one.

Taken from the example above, the first method is for the first drop-down list (country).

This method will allow you to add an empty value to the country list and insert that item in the first position.

private void Country_Databound(object sender, EventArgs e)
{
    var ddlType = (DropDownList)sender;
    var item = new ListItem("Select a country...", "");
    if (!ddlType.Items.Contains(item))
        ddlType.Items.Insert(0, item);
}

This second method is for the second drop-down list (state).

This one will add an empty value to the state list, but will also relaunch the databind of the third drop-down list (city).

This way, the city list will do its databind method after the second list has been filled.

private void State_DataBound(object sender, EventArgs e)
{
    var ddlType = (DropDownList)sender;
    var item = new ListItem("Select a state...", "");
    if (!ddlType.Items.Contains(item))
        ddlType.Items.Insert(0, item);
    ddlType.SelectedIndex = 0;
    REQUEST_CITY.DataBind();
}

The third method is for the third drop-down list (city).

This method will allow you to add an empty value to the city list and insert that item in the first position.

In the example above, there are only three drop-down lists, so it does not need to launch the databinding of another list.

private void City_Databound(object sender, EventArgs e)
{
    var ddlType = (DropDownList)sender;
    var item = new ListItem("Select a city...", "");
    if (!ddlType.Items.Contains(item))
        ddlType.Items.Insert(0, item);
}

Test of the solution

Sample process

Note: Import the three global lists prior to importing the process.