点击DataGrid的行选中checkbox并改变行的颜色
思路是根据网上流传的一个点击checkbox改变行颜色的代码,稍微修改了一下功能
注意是点击行选中checkbox,而不是相反
WebForm1.aspx
WebForm1.aspx.cs
注意是点击行选中checkbox,而不是相反
WebForm1.aspx
<%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="bm.WebForm1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1</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">
<script language="javascript">
function changecolor(obj,tr)
{
if(obj.checked)
{
tr.style.backgroundColor='#ffffff';
obj.checked = false
}
else
{
tr.style.backgroundColor='ffffe1';
obj.checked = true
}
}
</script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:datagrid id="DataGrid1" runat="server" Font-Size="8pt" CellPadding="4" AutoGenerateColumns="False"
BorderStyle="Solid" BorderWidth="1px" BorderColor="#999EB2">
<SelectedItemStyle Font-Bold="True"></SelectedItemStyle>
<ItemStyle Wrap="False" BackColor="White"></ItemStyle>
<HeaderStyle Wrap="False" Height="28px" BackColor="#E0E0E0"></HeaderStyle>
<FooterStyle Wrap="False" ForeColor="#E0E0E0"></FooterStyle>
<Columns>
<asp:TemplateColumn HeaderText="标识">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<asp:CheckBox id="chkExport" runat="server"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="字段1">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<asp:Label id=lbAsordNo runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"rs1").ToString()%>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="字段2">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem,"rs2").ToString()%>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="字段3">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem,"rs3").ToString()%>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
<PagerStyle HorizontalAlign="Left" BackColor="#E0E0E0" Wrap="False" Mode="NumericPages"></PagerStyle>
</asp:datagrid>
<asp:Button id="Button1" runat="server" Text="如果没有使用DataGridChangeColor,点击这个按钮回传后选中行的颜色无法保存"></asp:Button>
</form>
</body>
</HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1</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">
<script language="javascript">
function changecolor(obj,tr)
{
if(obj.checked)
{
tr.style.backgroundColor='#ffffff';
obj.checked = false
}
else
{
tr.style.backgroundColor='ffffe1';
obj.checked = true
}
}
</script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:datagrid id="DataGrid1" runat="server" Font-Size="8pt" CellPadding="4" AutoGenerateColumns="False"
BorderStyle="Solid" BorderWidth="1px" BorderColor="#999EB2">
<SelectedItemStyle Font-Bold="True"></SelectedItemStyle>
<ItemStyle Wrap="False" BackColor="White"></ItemStyle>
<HeaderStyle Wrap="False" Height="28px" BackColor="#E0E0E0"></HeaderStyle>
<FooterStyle Wrap="False" ForeColor="#E0E0E0"></FooterStyle>
<Columns>
<asp:TemplateColumn HeaderText="标识">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<asp:CheckBox id="chkExport" runat="server"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="字段1">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<asp:Label id=lbAsordNo runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"rs1").ToString()%>'>
</asp:Label>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="字段2">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem,"rs2").ToString()%>
</ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="字段3">
<HeaderStyle Wrap="False"></HeaderStyle>
<ItemStyle Wrap="False"></ItemStyle>
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem,"rs3").ToString()%>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
<PagerStyle HorizontalAlign="Left" BackColor="#E0E0E0" Wrap="False" Mode="NumericPages"></PagerStyle>
</asp:datagrid>
<asp:Button id="Button1" runat="server" Text="如果没有使用DataGridChangeColor,点击这个按钮回传后选中行的颜色无法保存"></asp:Button>
</form>
</body>
</HTML>
WebForm1.aspx.cs
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace bm
{
/// <summary>
/// WebForm1 的摘要说明。
/// </summary>
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.Button Button1;
protected System.Web.UI.WebControls.DataGrid DataGrid1;
//绑定DataGrid并变色
private void DataGridDataBind()
{
//绑定DataGrid,可以根据需要随意设置
DataSet ds = new DataSet();
ds.Tables.Add("AllTable");
ds.Tables["AllTable"].Columns.Add("rs1");
ds.Tables["AllTable"].Columns.Add("rs2");
ds.Tables["AllTable"].Columns.Add("rs3");
DataRow dr;
dr = ds.Tables["AllTable"].NewRow();
dr["rs1"] = "111";
dr["rs2"] = "222";
dr["rs3"] = "333";
ds.Tables["AllTable"].Rows.Add(dr);
dr = ds.Tables["AllTable"].NewRow();
dr["rs1"] = "aaa";
dr["rs2"] = "bbb";
dr["rs3"] = "ccc";
ds.Tables["AllTable"].Rows.Add(dr);
DataGrid1.DataSource = ds.Tables["AllTable"];
DataGrid1.DataBind();
//点击行改变checkbox状态并变色
for(int i=0;i<DataGrid1.Items.Count;i++)
{
CheckBox cb;
cb=(CheckBox)DataGrid1.Items[i].FindControl("chkExport");
DataGrid1.Items[i].Attributes.Add("id","tr" + i.ToString());
DataGrid1.Items[i].Attributes.Add("onclick","changecolor(" + cb.ClientID + ",tr" + i.ToString() + ");");
}
}
//此段代码用于点击页面其他按钮回传之后保存DataGrid改变颜色的行
//根据checkbox改变DataGrid1的颜色
private void DataGridChangeColor()
{
for(int i=0;i<DataGrid1.Items.Count;i++)
{
CheckBox cb = (CheckBox)DataGrid1.Items[i].FindControl("chkExport");
if(cb.Checked)
{
DataGrid1.Items[i].BackColor = Color.FromName("#ffffe1");
}
else
{
DataGrid1.Items[i].BackColor = Color.FromName("#ffffff");
}
}
}
private void Page_Load(object sender, System.EventArgs e)
{
if(!IsPostBack)
{
DataGridDataBind();
}
DataGridChangeColor();
}
#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace bm
{
/// <summary>
/// WebForm1 的摘要说明。
/// </summary>
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.Button Button1;
protected System.Web.UI.WebControls.DataGrid DataGrid1;
//绑定DataGrid并变色
private void DataGridDataBind()
{
//绑定DataGrid,可以根据需要随意设置
DataSet ds = new DataSet();
ds.Tables.Add("AllTable");
ds.Tables["AllTable"].Columns.Add("rs1");
ds.Tables["AllTable"].Columns.Add("rs2");
ds.Tables["AllTable"].Columns.Add("rs3");
DataRow dr;
dr = ds.Tables["AllTable"].NewRow();
dr["rs1"] = "111";
dr["rs2"] = "222";
dr["rs3"] = "333";
ds.Tables["AllTable"].Rows.Add(dr);
dr = ds.Tables["AllTable"].NewRow();
dr["rs1"] = "aaa";
dr["rs2"] = "bbb";
dr["rs3"] = "ccc";
ds.Tables["AllTable"].Rows.Add(dr);
DataGrid1.DataSource = ds.Tables["AllTable"];
DataGrid1.DataBind();
//点击行改变checkbox状态并变色
for(int i=0;i<DataGrid1.Items.Count;i++)
{
CheckBox cb;
cb=(CheckBox)DataGrid1.Items[i].FindControl("chkExport");
DataGrid1.Items[i].Attributes.Add("id","tr" + i.ToString());
DataGrid1.Items[i].Attributes.Add("onclick","changecolor(" + cb.ClientID + ",tr" + i.ToString() + ");");
}
}
//此段代码用于点击页面其他按钮回传之后保存DataGrid改变颜色的行
//根据checkbox改变DataGrid1的颜色
private void DataGridChangeColor()
{
for(int i=0;i<DataGrid1.Items.Count;i++)
{
CheckBox cb = (CheckBox)DataGrid1.Items[i].FindControl("chkExport");
if(cb.Checked)
{
DataGrid1.Items[i].BackColor = Color.FromName("#ffffe1");
}
else
{
DataGrid1.Items[i].BackColor = Color.FromName("#ffffff");
}
}
}
private void Page_Load(object sender, System.EventArgs e)
{
if(!IsPostBack)
{
DataGridDataBind();
}
DataGridChangeColor();
}
#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
浙公网安备 33010602011771号