Highlight a selected row in ASPX Datagrid, And Get the value

  • Thread starter Thread starter oliver
  • Start date Start date
O

oliver

Hi there,
Is there an example on how to highlight a selected row using ASPX on
a datagrid? Written in C#?

Thanks.
Oliver
 
Thanks for JC's suggestions.

Hi Oliver,

From your description, you'd like to make the selected row in the webform
DataGrid become highlighted, yes?
I think you have two means to implement this:
1. Set the DataGrid's Item's Back Color in the DataGrid's Property Builder
in the VS.NET IDE, you can set both the
NormalItems, AlternatingItems and SelectedItems .... 's Back Color or other
styles in the PropertyBuilder's Format area.
For detailed info, you may refer to the following reference in MSDN:

#Specifying Grid Item Format in a DataGrid Web Server Control
http://msdn.microsoft.com/library/en-us/vbcon/html/vbtskspecifyinggriditemfo
rmatindatagridwebcontrol.asp?frame=true

2. All the styles mentioned above(set in IDE statically) are able to set at
runtime via code. As JC has provided some code
snippets.

To make the above means clearly, I've also generate a simple demo page on
the above two means, please refer to it if you have any thing unclear,
below is the page's code:

--------------------------aspx page-------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>HighLight</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body>
<form id="Form1" method="post" runat="server">
<table width="100%" align="center">
<tr>
<td>
Dynamic Setting Color:<br>
<asp:DataGrid id="dgDynamic" runat="server"
AutoGenerateColumns="False">
<Columns>
<asp:BoundColumn DataField="Index"
HeaderText="Index"></asp:BoundColumn>
<asp:BoundColumn DataField="Name"
HeaderText="Name"></asp:BoundColumn>
<asp:BoundColumn DataField="Description"
HeaderText="Description"></asp:BoundColumn>
<asp:ButtonColumn Text="Select" HeaderText="Select"
CommandName="Select"></asp:ButtonColumn>
</Columns>
</asp:DataGrid>
</td>
</tr>
<tr>
<td>
Static Setting Color:<br>
<asp:DataGrid id="dgStatic" runat="server"
AutoGenerateColumns="False">
<SelectedItemStyle BackColor="White"></SelectedItemStyle>
<AlternatingItemStyle BackColor="Silver"></AlternatingItemStyle>
<ItemStyle BackColor="Silver"></ItemStyle>
<HeaderStyle BackColor="Silver"></HeaderStyle>
<Columns>
<asp:BoundColumn DataField="Index"
HeaderText="Index"></asp:BoundColumn>
<asp:BoundColumn DataField="Name"
HeaderText="Name"></asp:BoundColumn>
<asp:BoundColumn DataField="Description"
HeaderText="Description"></asp:BoundColumn>
<asp:ButtonColumn Text="Select" HeaderText="Select"
CommandName="Select"></asp:ButtonColumn>
</Columns>
</asp:DataGrid></td>
</tr>
</table>
</form>
</body>
</HTML>

--------------------code behind page class-----------------
public class HighLight : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid dgStatic;
protected System.Web.UI.WebControls.DataGrid dgDynamic;

private void Page_Load(object sender, System.EventArgs e)
{
if(!IsPostBack)
{
Bind_Data();
SetGridColor();
}
}

private void Bind_Data()
{
DataTable tb = new DataTable();
tb.Columns.Add("Index");
tb.Columns.Add("Name");
tb.Columns.Add("Description");

DataRow dr = null;
for(int i=1;i<=10;i++)
{
dr = tb.NewRow();
dr["Index"] = i.ToString();
dr["Name"] = "Name" + i.ToString();
dr["Description"] = "Description" + i.ToString();
tb.Rows.Add(dr);
}

dgDynamic.DataSource = tb;
dgDynamic.DataBind();

dgStatic.DataSource = tb;
dgStatic.DataBind();
}

#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}

private void InitializeComponent()
{
this.dgDynamic.SelectedIndexChanged += new
System.EventHandler(this.dgDynamic_SelectedIndexChanged);
this.Load += new System.EventHandler(this.Page_Load);

}
#endregion

private void dgDynamic_SelectedIndexChanged(object sender,
System.EventArgs e)
{
SetGridColor();
}

private void SetGridColor()
{
dgDynamic.HeaderStyle.BackColor = Color.Yellow;
for(int i=0;i<dgDynamic.Items.Count;i++)
{
dgDynamic.Items.BackColor = Color.Yellow;
}

if(dgDynamic.SelectedIndex >= 0)
{
dgDynamic.SelectedItem.BackColor = Color.Violet;
}
}
}

-------------------------------------------------------



Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

Get Preview at ASP.NET whidbey
http://msdn.microsoft.com/asp.net/whidbey/default.aspx
 
Back
Top