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;
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.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 }
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.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 }