Tuesday, 1 April 2014

How to implement cascading dropdown list in gridview using asp.net (Or) How to populate one dropdown based on selection in another dropdown on GridView in ASP.NET

In this article I will explain how to populate one dropdown based on selection in another dropdown on GridView in ASP.NET.


Or

How to implement cascading dropdown list in gridview using asp.net


I have three dropdowns Country dropdown lists, State dropdown, City dropdown I need to populate States dropdown based on Country dropdown and I need to populate City dropdown based on States dropdown.
 I have four tables in DataBase.




1.      Country Table (tblCountry)



2.      State Table (tblState)



3.      City Table (tblCity)


4.      GridView Table (tblCascading)



First we need to establish a connection in Web.config file.

<connectionStrings>
<add name="connectionString" connectionString="Data Source=LocalHost;uid=sa1;password=Con@123;Initial Catalog=practice"/>
</connectionStrings>

Below is the page design.



<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<table align="center">
<tr>
<td style="color: maroon; font-size: large;">
<b><u>In Gridview Populate one dropdown based on selection in another dropdown</u></b>
</td>
</tr>
<tr>
<td height="20px"></td>
</tr>
<tr>
<td>
<asp:GridView runat="server" ID="gvCascading" AutoGenerateColumns="false" ShowFooter="true" ShowHeader="true" OnRowDataBound="gvCascading_RowDataBound">
<Columns>
<asp:TemplateField HeaderText="SL NO.">
<ItemTemplate>
<asp:Label ID='lblID' runat="Server" Text='<%# Eval("ID") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Country Name">
<ItemTemplate>
<asp:Label ID='lblCountryName' runat="Server" Text='<%# Eval("CountryName") %>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:DropDownList runat="server" ID="ddlCountry" AutoPostBack="true" Width="150px" OnSelectedIndexChanged="ddlCountry_SelectedIndexChanged"></asp:DropDownList>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="State Name">
<ItemTemplate>
<asp:Label ID='lblStateName' runat="Server" Text='<%# Eval("StateName") %>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:DropDownList ID="ddlState" runat="server" AutoPostBack="true" Width="150px"
OnSelectedIndexChanged="ddlState_SelectedIndexChanged">
</asp:DropDownList>
</FooterTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="City Name">
<ItemTemplate>
<asp:Label ID='lblCityName' runat="Server" Text='<%# Eval("CityName") %>'></asp:Label>
</ItemTemplate>
<FooterTemplate>
<asp:DropDownList ID="ddlCity" runat="server" Width="150px"></asp:DropDownList>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
</tr>
</table>
</form>
</body>
</html>

Below is the total code for GridView Dropdowns lists cascading code.

using System;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Web.UI.WebControls;

public partial class GridViewDropdownlist : System.Web.UI.Page
{
SqlConnection conCascading = new SqlConnection(ConfigurationManager.ConnectionStrings["Connection"].ConnectionString);
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGridView();
}
}
protected void BindGridView()
{
conCascading.Open();
SqlCommand cmdCountry = new SqlCommand("select * from tblCascading", conCascading);
SqlDataAdapter daCountry = new SqlDataAdapter(cmdCountry);
DataSet dsCountry = new DataSet();
daCountry.Fill(dsCountry);
conCascading.Close();
gvCascading.DataSource = dsCountry;
gvCascading.DataBind();
}

protected void ddlCountry_SelectedIndexChanged(object sender, EventArgs e)
{
DropDownList ddlCountryGrid = (DropDownList)sender;
GridViewRow row = (GridViewRow)ddlCountryGrid.NamingContainer;

// Find your control
DropDownList ddlStateGrid = (DropDownList)row.FindControl("ddlState");
DropDownList ddlCityGrid = (DropDownList)row.FindControl("ddlCity");

conCascading.Open();
SqlCommand cmdstate = new SqlCommand("select * from tblState where CountryID=" + Convert.ToInt32(ddlCountryGrid.SelectedValue), conCascading);

cmdstate.ExecuteNonQuery();
SqlDataAdapter dastate = new SqlDataAdapter(cmdstate);
DataSet dsstate = new DataSet();
dastate.Fill(dsstate);
conCascading.Close();

ddlStateGrid.DataSource = dsstate;
ddlStateGrid.DataTextField = "StateName";
ddlStateGrid.DataValueField = "StateID";
ddlStateGrid.DataBind();

ddlStateGrid.Items.Insert(0, new ListItem("--Select State--", "0"));
ddlCityGrid.Items.Insert(0, new ListItem("--Select City--", "0"));
}

protected void ddlState_SelectedIndexChanged(object sender, EventArgs e)
{
DropDownList ddlState = (DropDownList)sender;
GridViewRow row = (GridViewRow)ddlState.NamingContainer;

// Find your control
DropDownList ddlCityGrid = (DropDownList)row.FindControl("ddlCity");

conCascading.Open();
SqlCommand cmdCity = new SqlCommand("select * from tblCity where StateID=" + Convert.ToInt32(ddlState.SelectedValue), conCascading);

cmdCity.ExecuteNonQuery();
SqlDataAdapter daCity = new SqlDataAdapter(cmdCity);
DataSet dsCity = new DataSet();
daCity.Fill(dsCity);
conCascading.Close();

ddlCityGrid.DataSource = dsCity;
ddlCityGrid.DataTextField = "CityName";
ddlCityGrid.DataValueField = "CityID";
ddlCityGrid.DataBind();
ddlCityGrid.Items.Insert(0, new ListItem("--Select City--", "0"));
}
protected void gvCascading_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Footer)
{

DropDownList ddlCountry = (DropDownList)e.Row.FindControl("ddlCountry");
DropDownList ddlState = (DropDownList)e.Row.FindControl("ddlState");
DropDownList ddlCity = (DropDownList)e.Row.FindControl("ddlCity");

conCascading.Open();
SqlCommand cmdCountry = new SqlCommand("select * from tblCountry", conCascading);
SqlDataAdapter daCountry = new SqlDataAdapter(cmdCountry);
DataSet dsCountry = new DataSet();
daCountry.Fill(dsCountry);
conCascading.Close();
ddlCountry.DataSource = dsCountry;
ddlCountry.DataTextField = "CountryName";
ddlCountry.DataValueField = "CountryID";
ddlCountry.DataBind();
ddlCountry.Items.Insert(0, new ListItem("--Select Country--", "0"));
ddlState.Items.Insert(0, new ListItem("--Select Country--", "0"));
ddlCity.Items.Insert(0, new ListItem("--Select Country--", "0"));

}
}
}

Output:





No comments:

Post a Comment