关于datagrid的几点简单应用，功能包括radio的单选，checkbox的多选，鼠标移动到行上颜色变深，链接传递多参数等功能。这里radio和checkbox都使用的是HTML控件。
有关checkbox的几个功能：全部选种、取消选种、没选中操作的检测等，这几个均使用js脚本实现。
运行效果图：
testdatagrid.aspx页面代码：
testdatagrid.aspx.cs页面代码：
生成数据库表用到的sql语句：
CREATE TABLE [dbo].[testDg] (
[id] [decimal](18, 0) IDENTITY (1, 1) NOT NULL ,
[name] [varchar] (50) COLLATE Chinese_PRC_CI_AS NULL ,
[card] [varchar] (50) COLLATE Chinese_PRC_CI_AS NULL ,
[price] [numeric](18, 2) NULL ,
[shijian] [datetime] NULL
) ON [PRIMARY]
GO
ALTER TABLE [dbo].[testDg] ADD
CONSTRAINT [DF_testDg_shijian] DEFAULT (getdate()) FOR [shijian],
CONSTRAINT [PK_testDg] PRIMARY KEY CLUSTERED
(
[id]
) ON [PRIMARY]
GO
有关checkbox的几个功能：全部选种、取消选种、没选中操作的检测等，这几个均使用js脚本实现。
运行效果图：
testdatagrid.aspx页面代码：
1
<%
@ Page language="c#" Codebehind="testdatagrid.aspx.cs" AutoEventWireup="false" Inherits="localhost.fenpage.testdatagrid" %>
2<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
3<HTML>
4 <HEAD>
5 <title></title>
6 <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
7 <meta name="CODE_LANGUAGE" Content="C#">
8 <meta name="vs_defaultClientScript" content="JavaScript">
9 <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
10 <script language="javascript">
11
//全部选中
12 function QuanXuan_Click()
13
{
14 if (document.Form1.checkboxname.length){
15 for (var i=0;i<document.Form1.checkboxname.length;i++){
16 document.Form1.checkboxname[i].checked = true;
17
}
18 }else{
19 document.Form1.checkboxname.checked = true;
20 }
21 }
22
23 //取消选中
24 function QuXiao_Click()
25 {
26 if (document.Form1.checkboxname.length){
27 for (var i=0;i<document.Form1.checkboxname.length;i++){
28 document.Form1.checkboxname[i].checked = false;
29 }
30 }else{
31 document.Form1.checkboxname.checked = false;
32 }
33 }
34
35 ///////////////判断没有选中的返回false
36 function slcNo_click()
37 {
38 if (document.Form1.checkboxname.length){
39 for (var i=0;i<document.Form1.checkboxname.length;i++){
40 if(document.Form1.checkboxname[i].checked)
41 {
42 return true;
43 }
44 }
45 }else{
46 if(document.Form1.checkboxname.checked)
47 {
48 return true;
49 }
50 }
51 alert("请选择后再操作！");
52 return false;
53 }
54
55 //////////////////////////////////////改变行的颜色
56 if (!objbeforeItem)
57 {
58 var objbeforeItem=null;
59 var objbeforeItembackgroundColor=null;
60 }
61 function ItemOver(obj)
62 {
63 objbeforeItembackgroundColor=obj.style.backgroundColor;
64 obj.style.backgroundColor="#B9D1F3";
65 objbeforeItem=obj;
66 }
67
68 function ItemOut(obj)
69 {
70 if(objbeforeItem)
71 {
72 objbeforeItem.style.backgroundColor=objbeforeItembackgroundColor;
73 }
74 }
75
</script>
76 </HEAD>
77 <body MS_POSITIONING="GridLayout">
78 <form id="Form1" method="post" runat="server">
79 <table>
80 <tr>
81 <td><FONT face="宋体"><asp:datagrid id="MyDataGrid" runat="server" Width="550px" AllowPaging="True" AutoGenerateColumns="False"
82 OnPageIndexChanged="MyDataGrid_Page" PageSize="10" CellPadding="2" HorizontalAlign="Left" BorderColor="Gray"
83 Font-Size="14px" Font-Names="新宋体">
84 <AlternatingItemStyle BackColor="#F2F2F2"></AlternatingItemStyle>
85 <ItemStyle Wrap="False" HorizontalAlign="Left" Height="22px" VerticalAlign="Middle"></ItemStyle>
86 <HeaderStyle Wrap="False" Height="25px" BackColor="#DEE6F6"></HeaderStyle>
87 <Columns>
88 <asp:BoundColumn Visible="False" DataField="id" SortExpression="id" HeaderText="id"></asp:BoundColumn>
89 <asp:TemplateColumn>
90 <HeaderTemplate>
91 选择
92 </HeaderTemplate>
93 <ItemTemplate>
94 <input type=radio name="RadioName" value='<%# DataBinder.Eval(Container.DataItem, "id")%>'/>
95 </ItemTemplate>
96 </asp:TemplateColumn>
97 <asp:TemplateColumn>
98 <HeaderTemplate>
99 选择
100 </HeaderTemplate>
101 <ItemTemplate>
102 <INPUT type="checkbox" name="checkboxname" value='<%# DataBinder.Eval(Container.DataItem, "id")%>'>
103 </ItemTemplate>
104 </asp:TemplateColumn>
105 <asp:TemplateColumn>
106 <HeaderTemplate>
107 模板列
108 </HeaderTemplate>
109 <ItemTemplate>
110 <asp:Label ID="lblId" Runat="server" Text=''>
111 </asp:Label>
112 <a href="abc.aspx?id=<%#DataBinder.Eval(Container.DataItem, "id") %>&name=<%#DataBinder.Eval(Container.DataItem, "name") %>" target="_blank">连接</a>
113 </ItemTemplate>
114 </asp:TemplateColumn>
115 <asp:HyperLinkColumn DataNavigateUrlField="id" DataNavigateUrlFormatString="aa.aspx?id={0}" DataTextField="name"
116 SortExpression="name" HeaderText="姓名" Target="_blank">
117 </asp:HyperLinkColumn>
118 <asp:BoundColumn DataField="card" SortExpression="card" HeaderText="身份证号" DataFormatString="{0:yyyy-MM-dd hh:mm:ss}"></asp:BoundColumn>
119 <asp:BoundColumn DataField="price" SortExpression="price" HeaderText="价格"></asp:BoundColumn>
120 <asp:BoundColumn DataField="shijian" SortExpression="shijian" HeaderText="shijian" DataFormatString="{0:yyyy年MM月dd日}"></asp:BoundColumn>
121 </Columns>
122 <PagerStyle Mode="NumericPages"></PagerStyle>
123 </asp:datagrid></FONT></td>
124 </tr>
125 <tr>
126 <td>
127 <asp:Button id="Button1" runat="server" Text="radio得到选择的行"></asp:Button>
128 <INPUT type="button" value="全部选中" onclick="QuanXuan_Click()">
129 <INPUT type="button" value="取消选中" onclick="QuXiao_Click()">
130 <asp:Button id="Button2" runat="server" Text="checkbox得到选择的行"></asp:Button>
131 </td>
132 </tr>
133 </table>
134 </form>
135 </body>
136</HTML>
137
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
testdatagrid.aspx.cs页面代码：
1using System;
2using System.Collections;
3using System.ComponentModel;
4using System.Data;
5using System.Data.SqlClient;
6using System.Drawing;
7using System.Web;
8using System.Web.SessionState;
9using System.Web.UI;
10using System.Web.UI.WebControls;
11using System.Web.UI.HtmlControls;
12using System.Configuration;
13
14namespace localhost.fenpage
15{
16 /**//// <summary>
17 /// testdgRadio 的摘要说明。
18 /// </summary>
19 public class testdatagrid : System.Web.UI.Page
20 {
21 protected System.Web.UI.WebControls.RadioButton RadioButton1;
22 protected System.Web.UI.WebControls.Button Button1;
23 protected System.Web.UI.WebControls.Button Button2;
24 protected System.Web.UI.WebControls.DataGrid MyDataGrid;
25
26 private void Page_Load(object sender, System.EventArgs e)
27 {
28 if (!IsPostBack)
29 {
30 BindGrid();
31 }
32
33 Button2.Attributes.Add("OnClick","return slcNo_click();");
34 }
35
36 public void MyDataGrid_Page(object sender, DataGridPageChangedEventArgs e)
37 {
38 MyDataGrid.CurrentPageIndex = e.NewPageIndex;
39 BindGrid();
40 }
41
42 private void BindGrid()
43 {
44 string strSql="";
45 DataSet ds = new DataSet();
46
47 strSql="Select * from testDg";
48 SqlConnection conn = new SqlConnection(ConfigurationSettings.AppSettings["ConnStr"]);
49 if (conn.State.ToString() == "Closed")
50 {
51 conn.Open();
52 }
53
54 SqlDataAdapter Da = new SqlDataAdapter(strSql, conn);
55 Da.Fill(ds, "testdg");
56 MyDataGrid.DataSource = ds.Tables["testdg"].DefaultView;
57 MyDataGrid.DataBind();
58
59 Da.Dispose();
60 if(conn.State.ToString()=="Open")
61 {
62 conn.Close();
63 }
64 conn.Dispose();
65 }
66
67 private void MyDataGrid_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
68 {
69 //配合前台脚本实现鼠标移动到每行上变颜色#region //配合前台脚本实现鼠标移动到每行上变颜色
70 if(e.Item.ItemIndex>=0)
71 {
72 e.Item.Attributes.Add("onmouseover","ItemOver(this)");/**///////在每行上增加脚本处理 onmouseover
73 e.Item.Attributes.Add("onmouseout","ItemOut(this)");/**///////在每行上增加脚本处理 onmouseout
74 }
75 #endregion
76 }
77
78 Web 窗体设计器生成的代码#region Web 窗体设计器生成的代码
79 override protected void OnInit(EventArgs e)
80 {
81 //
82 // CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
83 //
84 InitializeComponent();
85 base.OnInit(e);
86 }
87
88 /**//// <summary>
89 /// 设计器支持所需的方法 - 不要使用代码编辑器修改
90 /// 此方法的内容。
91 /// </summary>
92 private void InitializeComponent()
93 {
94 this.MyDataGrid.ItemCreated += new System.Web.UI.WebControls.DataGridItemEventHandler(this.MyDataGrid_ItemCreated);
95 this.Button1.Click += new System.EventHandler(this.Button1_Click);
96 this.Button2.Click += new System.EventHandler(this.Button2_Click);
97 this.Load += new System.EventHandler(this.Page_Load);
98
99 }
100 #endregion
101
102 private void Button1_Click(object sender, System.EventArgs e)
103 {
104 Page.Response.Write(Page.Request.Form.Get("RadioName"));
105 }
106
107 private void Button2_Click(object sender, System.EventArgs e)
108 {
109 string str="";
110 string []ckb=null;
111
112 str=Page.Request.Form.Get("checkboxname");
113 ckb=str.Split(new char[]{','});
114
115 Page.Response.Write("直接在页面中得到的值为："+str+"<br>");
116
117 Page.Response.Write("处理后存放在数组中，如下：<br>");
118 for(int i=0;i<ckb.Length;i++)
119 {
120 Page.Response.Write("ckb["+i+"]的值为："+ckb[i]+"<br>");
121 }
122 }
123 }
124}
125
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
生成数据库表用到的sql语句：
转载于:https://www.cnblogs.com/hzuIT/articles/472795.html