关于datagrid的几点简单应用-.NET教程,数据库应用:站长天空｜虚拟主机资讯|虚拟主机新闻|虚拟主机动态

关于datagrid的几点简单应用，功能包括radio的单选，checkbox的多选，鼠标移动到行上颜色变深，链接传递多参数等功能。这里radio和checkbox都使用的是html控件。
        有关checkbox的几个功能：全部选种、取消选种、没选中操作的检测等，这几个均使用js脚本实现。

        运行效果图：

testdatagrid.aspx页面代码：

<%@ 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

//全部选中
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

//取消选中
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

///////////////判断没有选中的返回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

//////////////////////////////////////改变行的颜色
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

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

testdatagrid.aspx.cs页面代码：

using system;
2

using system.collections;
3

using system.componentmodel;
4

using system.data;
5

using system.data.sqlclient;
6

using system.drawing;
7

using system.web;
8

using system.web.sessionstate;
9

using system.web.ui;
10

using system.web.ui.webcontrols;
11

using system.web.ui.htmlcontrols;
12

using system.configuration;
13

namespace 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

private void page_load(object sender, system.eventargs e)
27

{
28

if (!ispostback)
29

{
30

bindgrid();
31

}
32

button2.attributes.add("onclick","return slcno_click();");
34

}
35

public void mydatagrid_page(object sender, datagridpagechangedeventargs e)
37

{
38

mydatagrid.currentpageindex = e.newpageindex;
39

bindgrid();
40

}
41

private void bindgrid()
43

{
44

string strsql="";
45

dataset ds = new dataset();
46

strsql="select * from testdg";
48

sqlconnection conn = new sqlconnection(configurationsettings.appsettings["connstr"]);
49

if (conn.sta