In this article, we will show how to fill a DropDownList inside a DataGrid through an XML file. We will also show how the contents of one DropDownList changes dynamically as we change the index of second DropDownList (both inside the grid).
Brief description
Here we have a datagrid with two template columns; we have two dropdowns inside these columns. In this example one dropdown is populated with the states and second is populated with the cities of state of the corresponding (same row) dropdown. If we change the index of dropdown populated with states second dropdown is populated with the cities of corresponding state.
Main events
- IsPostBack to bind events.
- SelectedIndexChanged event of Dropdown.
- XML file code access to populate dropdown list in datagrid.
Source Code
Imports Microsoft.VisualBasic
Imports System
Imports System.Collections
Imports System.ComponentModel
Imports System.Data
Imports System.Drawing
Imports System.Web
Imports System.Web.SessionState
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.HtmlControls
Imports System.Text.RegularExpressions
Imports System.Data.SqlClient
Imports System.Xml
Namespace Helper_Project
''' <summary>
''' Summary description for WebForm1.
''' </summary>
Public Class WebForm1 : Inherits System.Web.UI.Page
Protected sampleGrid As System.Web.UI.WebControls.DataGrid
Private Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles MyBase.Load
' Put user code to initialize the page here
If (Not IsPostBack) Then
Me.FillGrid() 'this function populates the grid
Me.FillState() 'for every dataitem in grid this function each state dropdown
End If
' note how SelectedIndexChanged event of dropdown is declared and it is for every dropdown in the grid.
' foreach(DataGridItem dItem in sampleGrid.Items)
' {
' DropDownList stateList = (DropDownList)dItem.Cells[1].FindControl("stateList");
' stateList.SelectedIndexChanged += new System.EventHandler
this.stateList_SelectedIndexChanged);
' }
End Sub
#Region "Web Form Designer generated code"
Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init
'
' CODEGEN: This call is required by the ASP.NET Web Form Designer.
'
InitializeComponent()
End Sub
''' <summary>
''' Required method for Designer support - do not modify
''' the contents of this method with the code editor.
''' </summary>
Private Sub InitializeComponent()
' Me.Load += New System.EventHandler(Me.Page_Load);
End Sub
#End Region
'this function populates the grid
Private Sub FillGrid()
Dim dTable As DataTable = New DataTable()
Dim dColumn As DataColumn = New DataColumn("Id",System.Type.GetType("System.String"))
dTable.Columns.Add(dColumn)
For i As Integer = 0 To 4
Dim row As DataRow = dTable.NewRow()
row(0) = i
dTable.Rows.Add(row)
Next i
sampleGrid.DataSource = dTable
sampleGrid.DataBind()
End Sub
'for every dataitem in grid this function each state dropdown
Private Sub FillState()
Dim xRead As XmlTextReader = New XmlTextReader(Server.MapPath("XMLFile1.xml"))
Dim doc As XmlDocument = New XmlDocument()
doc.Load(Server.MapPath("XMLFile1.xml"))
Dim xList As XmlNodeList = doc.GetElementsByTagName("state")
Dim node As XmlNode = Nothing
Dim node0 As XmlNode = xList.Item(0)
For num As Integer = 0 To 4
Dim i As Integer= 0
Do While i < xList.Count
node = xList.Item(i)
Dim lItem As ListItem = New ListItem(xList.Item(i).Attributes.GetNamedItem("key").Value,xList.Item(i).Attributes.GetNamedItem("key").Value)
CType(sampleGrid.Items(num).Cells(1).FindControl("stateList"), DropDownList).Items.Add(lItem)
i += 1
Loop
Me.FillCity(node0)
Next num
End Sub
'for every state cities are filled accordingly
Private Sub FillCity(ByVal xNode As XmlNode)
Dim city As String = ""
If (Not Object.Equals(xNode,Nothing)) Then
Dim xCity As XmlNodeList = xNode.ChildNodes
For Each dt As DataGridItem In sampleGrid.Items
CType(dt.Cells(0).FindControl("cityList"), DropDownList).Items.Clear()
Dim j As Integer = 0
Do While j < xCity.Count
city = xCity.Item(j).InnerText
Dim lItem As ListItem = New ListItem(city,city)
CType(dt.Cells(0).FindControl("cityList"), DropDownList).Items.Add(lItem)
j += 1
Loop
Next dt
End If
End Sub
'In this function note that how the datagriditem of the current row is accessed
'so that cities of that particular row only should be changed.
Public Sub stateList_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs)
Dim dlist As DropDownList = CType(sender, DropDownList)
Dim s As TableCell = CType(dlist.Parent, TableCell)
Dim dItem As DataGridItem = CType(s.Parent, DataGridItem)
Dim index As Integer = dItem.ItemIndex
Dim xRead As XmlTextReader = New XmlTextReader(Server.MapPath("XMLFile1.xml"))
Dim doc As XmlDocument = New XmlDocument()
doc.Load(Server.MapPath("XMLFile1.xml"))
Dim xList As XmlNodeList = doc.GetElementsByTagName("state")
Dim node As XmlNode = Nothing
Dim i As Integer = 0
Do While i < xList.Count
If xList.Item(i).Attributes.GetNamedItem("key").Value = dlist.SelectedValue Then
node = xList.Item(i)
Exit Do
End If
i += 1
Loop
CType(dItem.Cells(0).FindControl("cityList"), DropDownList).Items.Clear()
For Each nod As XmlNode In node.ChildNodes
CType(dItem.Cells(0).FindControl("cityList"), DropDownList).Items.Add(nod.InnerText)
Next nod
End Sub
End Class
End Namespace
NOTE: THIS ARTICLE IS CONVERTED FROM C# TO VB.NET USING A CONVERSION TOOL. ORIGINAL ARTICLE CAN BE FOUND ON C# CORNER (WWW.C-SHARPCORNER.COM).