GridView結合JavaScript做出點選任何一個Row中的Cell產生選取變色效果
.aspx
01 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="sqldatasoruce2.aspx.cs" Inherits="sqldatasoruce2" %>
02
03 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
04 <html xmlns="http://www.w3.org/1999/xhtml">
05 <head id="Head1" runat="server">
06 <title>未命名頁面</title>
07
08 <script language="javascript" type="text/javascript">
09 var temp=null;
10 function select(sel)
11 {
12 if(temp==null)
13 {
14 temp=sel;
15 sel.style.backgroundColor="red";
16 }
17 else
18 {
19 temp.style.backgroundColor="#FFFFFF";
20 sel.style.backgroundColor="red";
21 temp=sel;
22 }
23 }
24 </script>
25
26 </head>
27 <body>
28 <form id="form1" runat="server">
29 <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1"
30 OnRowDataBound="GridView1_RowDataBound">
31 <Columns>
32 <asp:BoundField DataField="test" HeaderText="test" SortExpression="test" />
33 </Columns>
34 </asp:GridView>
35 <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
36 SelectCommand="SELECT * FROM [test2]"></asp:SqlDataSource>
37 </form>
38 </body>
39 </html>
40
02
03 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
04 <html xmlns="http://www.w3.org/1999/xhtml">
05 <head id="Head1" runat="server">
06 <title>未命名頁面</title>
07
08 <script language="javascript" type="text/javascript">
09 var temp=null;
10 function select(sel)
11 {
12 if(temp==null)
13 {
14 temp=sel;
15 sel.style.backgroundColor="red";
16 }
17 else
18 {
19 temp.style.backgroundColor="#FFFFFF";
20 sel.style.backgroundColor="red";
21 temp=sel;
22 }
23 }
24 </script>
25
26 </head>
27 <body>
28 <form id="form1" runat="server">
29 <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1"
30 OnRowDataBound="GridView1_RowDataBound">
31 <Columns>
32 <asp:BoundField DataField="test" HeaderText="test" SortExpression="test" />
33 </Columns>
34 </asp:GridView>
35 <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
36 SelectCommand="SELECT * FROM [test2]"></asp:SqlDataSource>
37 </form>
38 </body>
39 </html>
40
.cs
01 
using System;
02
using System.Data;
03using System.Configuration;
04using System.Collections;
05using System.Web;
06using System.Web.Security;
07using System.Web.UI;
08using System.Web.UI.WebControls;
09using System.Web.UI.WebControls.WebParts;
10
using System.Web.UI.HtmlControls;
11
12public partial class sqldatasoruce2 : System.Web.UI.Page
13{
14
protected void Page_Load(object sender, EventArgs e)
15
{
16
17
}
18 protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
19 {
20 if (e.Row.RowType == DataControlRowType.DataRow)
21 {
22 e.Row.Attributes.Add("onclick", "select(this)");
23 }
24 }
25}
using System;
using 02
using System.Data;03
using System.Configuration;04
using System.Collections;05
using System.Web;06
using System.Web.Security;07
using System.Web.UI;08
using System.Web.UI.WebControls;09
using System.Web.UI.WebControls.WebParts;10
using System.Web.UI.HtmlControls;11
12
public partial class sqldatasoruce2 : System.Web.UI.Page13
{14
protected void Page_Load(object sender, EventArgs e)15
{
16
17
}18
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)19
{20
if (e.Row.RowType == DataControlRowType.DataRow)21
{22
e.Row.Attributes.Add("onclick", "select(this)");23
}24
}25
}