Here i am having a GridView in which 5 row and 5 columns are there. I am just binding it with an empty DataTable. I have set the GridView to AutoGenerateColumns="false". On DropDownList SelectedItemChanged event i am finding the Row in the GridView. In that perticular GrdiView i am setting the Cell color based on DropDown Selected values.
HTML: You have to set the DropDownList id same as what i have set.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.tabel
{
padding: 10px;
}
.tabel td
{
padding: 10px;
margin: 10px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" CssClass="tabel" OnRowDataBound="GridView1_OnRowDataBound"
AutoGenerateColumns="false">
<Columns>
<asp:TemplateField HeaderText="Column1">
<ItemTemplate>
<asp:DropDownList ID="DropDownList1" OnSelectedIndexChanged="DropDownList_OnSelectedIndexChanged"
AutoPostBack="true" runat="server">
<asp:ListItem Text="Red" />
<asp:ListItem Text="Green" />
<asp:ListItem Text="Blue" />
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Column2">
<ItemTemplate>
<asp:DropDownList ID="DropDownList2" OnSelectedIndexChanged="DropDownList_OnSelectedIndexChanged"
runat="server">
<asp:ListItem Text="Red" />
<asp:ListItem Text="Green" />
<asp:ListItem Text="Blue" />
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Column3">
<ItemTemplate>
<asp:DropDownList ID="DropDownList3" OnSelectedIndexChanged="DropDownList_OnSelectedIndexChanged"
AutoPostBack="true" runat="server">
<asp:ListItem Text="Red" />
<asp:ListItem Text="Green" />
<asp:ListItem Text="Blue" />
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Column4">
<ItemTemplate>
<asp:DropDownList ID="DropDownList4" OnSelectedIndexChanged="DropDownList_OnSelectedIndexChanged"
AutoPostBack="true" runat="server">
<asp:ListItem Text="Red" />
<asp:ListItem Text="Green" />
<asp:ListItem Text="Blue" />
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Column5">
<ItemTemplate>
<asp:DropDownList ID="DropDownList5" OnSelectedIndexChanged="DropDownList_OnSelectedIndexChanged"
AutoPostBack="true" runat="server">
<asp:ListItem Text="Red" />
<asp:ListItem Text="Green" />
<asp:ListItem Text="Blue" />
</asp:DropDownList>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
C#:
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.Add("columns");
for (int i = 0; i < 5; i++)
{
dt.Rows.Add();
}
this.GridView1.DataSource = dt;
this.GridView1.DataBind();
}
}
protected void GridView1_OnRowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
for (int i = 0; i <= e.Row.Cells.Count - 1; i++)
{
System.Web.UI.WebControls.DropDownList ddl = (System.Web.UI.WebControls.DropDownList)e.Row.FindControl("DropDownList" + (i + 1).ToString());
switch (ddl.SelectedItem.Text)
{
case "Red":
e.Row.Cells[i].BackColor = Color.Red;
break;
case "Green":
e.Row.Cells[i].BackColor = Color.Green;
break;
case "Blue":
e.Row.Cells[i].BackColor = Color.Blue;
break;
}
}
}
}
protected void DropDownList_OnSelectedIndexChanged(object sender, EventArgs e)
{
GridViewRow row = (GridViewRow)((System.Web.UI.WebControls.DropDownList)sender).NamingContainer;
for (int i = 0; i <= row.Cells.Count - 1; i++)
{
System.Web.UI.WebControls.DropDownList ddl = (System.Web.UI.WebControls.DropDownList)row.FindControl("DropDownList" + (i + 1).ToString());
switch (Request.Form[ddl.UniqueID])
{
case "Red":
row.Cells[i].BackColor = Color.Red;
break;
case "Green":
row.Cells[i].BackColor = Color.Green;
break;
case "Blue":
row.Cells[i].BackColor = Color.Blue;
break;
}
}
}
Image:
Thank You.
