Choose Country State Corresponding City List Appears without Refreshing the Page in VB.NET

In this article we will know when we are choosing a selected country from DropDownList its related state appears in another dropdown and after selecting the state its related city list appears in other DropDownList, without refreshing the webpage. Here we need three-DropDownList , three label controls, Script Manager and Update Panel from the toolbox.

Table Creation

Country-table-in-SQL-Server.gif

State-table-data-in-SQL-Server.gif

City table data

City-table-data-in-SQL-Server.gif

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default"%>
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">
<
title>Untitled Page</title>

</
head>
<
body>
<form id="form1" runat="server">

     <div>
   <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
           <asp:UpdatePanel ID="countrypanel" runat="server">
           <ContentTemplate >
           <asp:Label ID="Label1" runat="server" Text="Choose Country" BackColor="#FFFF99"
 

                   ForeColor="Red" Width="100px"></asp:Label>
              <asp:DropDownList ID="ddlcountry" AutoPostBack ="true"
                   AppendDataBoundItems="true"  runat="server" Height="20px" Width="156px"
                   onselectedindexchanged="ddlcountry_SelectedIndexChanged" Font-Bold="True"
                   ForeColor="#FF9900">
            </asp:DropDownList>
        </ContentTemplate>
  
      <Triggers>
       <asp:AsyncPostBackTrigger ControlID ="ddlcountry" />
      </Triggers>
   </asp:UpdatePanel>
        <br />

  
  <asp:UpdatePanel ID="statepanel" runat="server">     
     <ContentTemplate >
     <asp:Label ID="Label2" runat="server" Text="Choose State" BackColor="#FFFF66"
             ForeColor="Red" Width="100px"></asp:Label>
       <asp:DropDownList ID="ddlstate" AutoPostBack ="true"
             AppendDataBoundItems ="true"  runat="server" Height="20px"

Width
="155px" onselectedindexchanged="ddlstate_SelectedIndexChanged" Font-Bold="True"
             ForeColor="#993300">
       </asp:DropDownList>
     </ContentTemplate>
     <Triggers >
        <asp:AsyncPostBackTrigger ControlID ="ddlstate" />
        </Triggers>
     </asp:UpdatePanel>
        <br />

<
asp:UpdatePanel ID="citypanel" runat="server">      
    <ContentTemplate >    
    <asp:Label ID="Label3" runat="server" Text="Choose City" BackColor="#FFFF99"
            ForeColor="Red" Width="100px"></asp:Label>  
      <asp:DropDownList ID="ddlcity"  AutoPostBack ="true" AppendDataBoundItems ="true"
            runat="server" Height="20px" Width="155px" Font-Bold="True" ForeColor="#CCCC00">
      </asp:DropDownList>
   </ContentTemplate>
   <Triggers >
     <asp:AsyncPostBackTrigger  ControlID ="ddlcity" /></Triggers>
  </asp:UpdatePanel>
</div>
    </form>

</
body>
</
html>

Imports System.Data
Imports
 System.Data.SqlClient
Partial
 Class _Default
    Inherits System.Web.UI.Page
    Dim strConnString As String = System.Configuration.ConfigurationManager.ConnectionStrings.Item("ConnectionString").ToString()
    Dim con As New SqlConnection(strConnString)
    Dim str As String
    Dim com As SqlCommand

    Dim sqlda As SqlDataAdapter
    Dim ds As DataSet
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) HandlesMe.Load
        If Not IsPostBack Then
            bindcountry()
        End If
    End Sub
    Sub bindcountry()
        con.Open()
        str = "select CountryId,CountryName from Country"
        com = New SqlCommand(str, con)
        sqlda = New SqlDataAdapter(com)
        ds = New DataSet
        sqlda.Fill(ds, "Country")
        ddlcountry.Items.Clear()
        ddlcountry.Items.Add("--Select--")
        ddlcountry.DataValueField = "CountryId"
        ddlcountry.DataTextField = "CountryName"
        ddlcountry.DataSource = ds
        ddlcountry.DataMember = "Country"
        ddlcountry.DataBind()

        con.Close()
    End Sub
    Sub bindstate()
        con.Open()
        str = "select StateId,StateName from State where Country_Id='" & ddlcountry.SelectedValue & "'"
        com = New SqlCommand(str, con)
        sqlda = New SqlDataAdapter(com)
        ds = New DataSet
        sqlda.Fill(ds, "State")
        ddlstate.Items.Clear()
        ddlstate.Items.Add("--Select--")
        ddlstate.DataValueField = "StateId"
        ddlstate.DataTextField = "StateName"
        ddlstate.DataSource = ds
        ddlstate.DataMember = "State"
      ddlstate.DataBind()
        con.Close()
    End Sub
    Sub bindcity()
        con.Open()
        str = "select CityId,CityName from City where State_Id ='" & ddlstate.SelectedValue & "'"
        com = New SqlCommand(str, con)
        sqlda = New SqlDataAdapter(com)
        ds = New DataSet
        sqlda.Fill(ds, "City")
        ddlcity.Items.Clear()
        ddlcity.Items.Add("--Select--")
        ddlcity.DataValueField = "CityId"
        ddlcity.DataTextField = "CityName"
        ddlcity.DataSource = ds
        ddlcity.DataMember = "City"
        ddlcity.DataBind()
        con.Close()
    End Sub
    Protected Sub ddlcountry_SelectedIndexChanged(ByVal sender As Object, ByVal e AsSystem.EventArgs) Handles ddlcountry.SelectedIndexChanged
        bindstate()
    End Sub
    Protected Sub ddlstate_SelectedIndexChanged(ByVal sender As Object, ByVal e AsSystem.EventArgs) Handles ddlstate.SelectedIndexChanged
        bindcity()
    End Sub

End
 Class

Output

County-State-City-Output-in-asp.net.gif

Up Next
    Ebook Download
    View all
    Learn
    View all