Series DropDownList: Binding XML Data to a DropDownList

Who doesn’t love XML? Extensible Markup Language (XML) is a markup language that defines a set of rules for encoding documents in a format that is both human-readable and machine-readable. It is defined in the XML 1.0 Specification produced by the W3C, and several other related specifications, all gratis open standards.  The design goals of XML emphasize simplicity, generality, and usability over the Internet. It is a textual data format with strong support via Unicode for the languages of the world. Although the design of XML focuses on documents, it is widely used for the representation of arbitrary data structures, for example in web services. Bottom line XML is easily created, consumed, and understood.

In this article we will focus on the basic idea of binding XML data to a DropDownList. When it is all said and done your DropDownList will look similar to the following example.

dropdown list bound with xml data

XML Source

First we need a XML file. In this example we have XML that contains countries, regions, and cities.

<?xml version="1.0" encoding="utf-8" ?>
 <Countries>
 <Country name="Korea">
 <Region name="South Korea">
 <City>
 Seoul
 </City>
 <City>
 Taegu
 </City>
 <City>
 Songtan
 </City>
 </Region>
 </Country>
 <Country name="USA">
 <Region name="California">
 <City>
 Los Angeles
 </City>
 <City>
 Bakersfield
 </City>
 <City>
 Oakland
 </City>
 <City>
 San Diego
 </City>
 </Region>
 <Region name="Missouri">
 <City>
 Kansas City
 </City>
 <City>
 St. Louis
 </City>
 </Region>
 <Region name="Texas">
 <City>
 Dallas
 </City>
 <City>
 Houston
 </City>
 <City>
 San Antonio
 </City>
 </Region>
 </Country>
 </Countries>

Web Form

Next you need to create your form and add the necessary DropDownList that you will be working with, here I have three:

  1. Country
  2. Region
  3. City
<label for="ddlCountry">Country:</label>
 <asp:DropDownList ID="ddlCountry" runat="server" AutoPostBack="True" Width="160px">
 </asp:DropDownList>
 <label for="ddlRegion">Region:</label>
 <asp:DropDownList ID="ddlRegion" runat="server" AutoPostBack="True" Width="160px">
 </asp:DropDownList>
 <label for="ddlCity">City:</label>
 <asp:DropDownList ID="ddlCity" runat="server" Width="160px"></asp:DropDownList>

Code Behind

So at this point we are ready to begin the process of retrieving and binding the data we will to consume. Before we do this it is important to point out the class will performs the work when it comes to interfacing with the XML file. You will see in the class RetrieveDataFromXML a number of methods which returns a list of countries, regions, and finally cities.

public class RetrieveDataFromXml
 {
 public RetrieveDataFromXml() { }

private static string strXmlPath = HttpContext.Current.Server.MapPath(
 "App_Data") + "CustomDataSource.xml";

public static List<string> GetAllCountry()
 {
 XmlDocument document = new XmlDocument();
 document.Load(strXmlPath);
 XmlNodeList nodeList = document.SelectNodes("Countries/Country");
 List<string> list = new List<string>();
 foreach (XmlNode node in nodeList)
 {
 list.Add(node.Attributes["name"].Value);
 }
return list;
 }

public static List<string> GetRegionByCountry(string strCountry)
 {
 XmlDocument document = new XmlDocument();
 document.Load(strXmlPath);
 XmlNodeList nodeList = document.SelectNodes(
 "Countries/Country[@name='" + strCountry + "']/Region");
 List<string> list = new List<string>();
 foreach (XmlNode node in nodeList)
 {
 list.Add(node.Attributes["name"].Value);
 }
return list;
 }

public static List<string> GetCityByRegion(string strRegion)
 {
 XmlDocument document = new XmlDocument();
 document.Load(strXmlPath);
 XmlNodeList nodeList = document.SelectNodes(
 "Countries/Country/Region[@name='" + strRegion + "']/City");
 List<string> list = new List<string>();
 foreach (XmlNode node in nodeList)
 {
 list.Add(node.InnerText.ToString());
 }
 return list;
 }
 }

Now all that remains is to begin to populate the DropDownList once the web page is rendered.

protected void Page_Load(object sender, EventArgs e)
 {
 if (!IsPostBack)
 {
 // Bind Country dropdownlist
 BindddlCountry();
 ddlRegion.Enabled = false;
 ddlCity.Enabled = false;

// Insert one item to dropdownlist top
 ddlRegion.Items.Insert(0, new ListItem("Select Region", "-1"));
 ddlCity.Items.Insert(0, new ListItem("Select City", "-1"));
 }
 }

public void BindddlCountry()
 {
 List<string> list = RetrieveDataFromXml.GetAllCountry();
 ddlCountry.DataSource = list;
 ddlCountry.DataBind();
 ddlCountry.Items.Insert(0, new ListItem("Select Country", "-1"));
 }

Conclusion

At the end of the day consuming and binding data via XML is really no different that a traditional datasource such as a database. If you’re not familiar with the XmlDocument Class then be sure to head over to MSDN and check out the documentation.

Leave a Reply

Required fields are marked *.