ASP.NET中的DataGrid控件示例 Powered By:记得忘记
关于DataGrid 的几点简单应用:
1、有关checkbox的几个功能:全部选种、取消选种、没选中操作的检测等,这几个均使用js脚本实现。
2、根据主键关键字进行查询,如果条件输入为空,则检索所有数据
3、显示页面状态,第几页总共几页
4、DataGrid 分页、根据输入的数字跳转到指定页
5、DataGrid的正反双向排序
6、DataGrid的删除、根据主键进行删除
7、DataGrid的编辑、点击后弹出更新、取消按钮
8、插入数据操作、通用BLL层实现
9、DataGrid 根据复选框删除对应记录


1

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

138

139

140


141

142

143

144

145

146

147



148

149

150

151



152

153

154



155

156

157

158

159

160


161

162

163

164

165



166

167

168

169

170


171

172

173

174

175

176

177



178

179

180



181

182

183



184

185

186

187

188

189



190

191

192

193

194

195

196

197

198

199

200

201

202

203

204


205

206

207

208

209

210

211



212

213



214

215

216

217

218



219

220

221

222

223


224

225

226

227

228

229

230



231

232



233

234

235



236

237

238

239

240

241

242



243

244

245

246

247


248

249

250

251

252

253

254



255

256

257

258



259

260

261

262

263

264

265

266

267


268

269

270

271

272

273

274



275

276

277

278



279

280

281



282

283



284

285



286

287

288

289



290

291

292

293



294

295

296

297

298

299

300

301

302


303

304

305

306

307

308

309



310

311

312

313

314


315

316

317

318

319

320

321



322

323

324

325

326

327


328

329

330

331

332

333

334



335

336



337

338

339

340

341

342

343

344

345

346

347

348

349

350

351

352

353

354

355


356

357

358

359

360

361

362



363

364

365

366

367

368

369


370

371

372

373

374

375

376



377

378

379

380

381

382

383

384

385

386

387

388

389

390



391

392

393

394



395

396

397

398

399


400

401

402

403

404

405

406



407

408

409



410

411

412

413



414

415

416

417



418

419



420

421

422



423

424

425

426



427

428

429

430

431

432

433

434

435

436

SugarcaneClassInfo.ascx:
1
<%
@ Register TagPrefix="cc1" Namespace="BaseComponent" Assembly="BaseComponent"
%>
2
<%
@ Control Language="c#" AutoEventWireup="false" Codebehind="SugarcaneClassInfo.ascx.cs" Inherits="WebUI.Modules.BaseData.SugarcaneClassInfo" TargetSchema="http://schemas.microsoft.com/intellisense/ie5"
%>
3
<
script
>
4
//DataGrid单击行时改变颜色
5
var oldrow;
6
var newColor='#BDBD00';
7
var oldColor;
8
9
function SelectRow(rowno)
10
{
11
if (oldrow == null)
12
{
13
oldColor = document.all('row'+rowno).style.backgroundColor;
14
document.all('row'+rowno).style.backgroundColor = newColor;
15
}
16
else
17
{
18
oldrow.style.backgroundColor = oldColor;
19
oldColor = document.all('row'+rowno).style.backgroundColor;
20
document.all('row'+rowno).style.backgroundColor = newColor;
21
}
22
23
oldrow = document.all('row'+rowno);
24
}
25
26
var checkFlag = true;
27
function ChooseAll()
28
{
29
//if( !document.all("CheckAll").Checked ) // 全选
30
if( checkFlag ) // 全选
31
{
32
var inputs = document.all.tags("INPUT");
33
for (var i=0; i < inputs.length; i++) // 遍历页面上所有的 input
34
{
35
if (inputs[i].type == "checkbox" && inputs[i].id != "CheckAll" )
36
{
37
inputs[i].checked = true;
38
}
39
}
40
checkFlag = false;
41
}
42
else // 取消全选
43
{
44
var inputs = document.all.tags("INPUT");
45
for (var i=0; i < inputs.length; i++) // 遍历页面上所有的 input
46
{
47
if (inputs[i].type == "checkbox" && inputs[i].id != "CheckAll" )
48
{
49
inputs[i].checked = false;
50
}
51
}
52
checkFlag = true;
53
}
54
}
55
56
// <summary>
57
// 让用户加以确认删除数据。
58
// </summary>
59
function DelRec()
60
{
61
var inputs = document.all.tags("input");
62
var selectedLen = 0;
63
for( var i=0;i < inputs.length; i ++)
64
{
65
if(inputs[i].type == "checkbox")
66
{
67
if( inputs[i].checked )
68
{
69
if(inputs[i].id != "CheckAll")
70
{
71
selectedLen ++;
72
}
73
}
74
}
75
}
76
if( selectedLen == 0 )
77
{
78
alert("请先选择您要删除的数据!");
79
}
80
else
81
{
82
var flag = confirm("您确定要删除所选择的这 " + selectedLen + " 条数据吗?");
83
if(flag)
84
{
85
document.all("ibtnDel").click();
86
}
87
}
88
}
89
90
91
</
script
>
92
<
P
><
FONT
face
="宋体"
>
93
<
TABLE
class
="TABLE"
id
="Table1"
style
="WIDTH: 771px; HEIGHT: 248px"
cellSpacing
="1"
cellPadding
="1"
94
width
="771"
align
="center"
border
="0"
>
95
<
TR
>
96
<
TD
>
97
<
P
>
98
<
HR
color
="background"
SIZE
="1"
>
99
编号关键字:
100
<
asp:textbox
id
="txtClassID"
runat
="server"
></
asp:textbox
><
asp:imagebutton
id
="ibtnSearch"
runat
="server"
ImageUrl
="../../Images/button_search.GIF"
></
asp:imagebutton
>
101
【按编号关键字进行搜索】
102
</
TD
>
103
</
TR
>
104
<
TR
>
105
<
TD
style
="HEIGHT: 16px"
>
106
<
P
align
="left"
>
品种名称:
107
<
asp:textbox
id
="txtClassName"
runat
="server"
></
asp:textbox
>
108
价格:
109
<
asp:textbox
id
="txtPrice"
runat
="server"
></
asp:textbox
>
备注:
110
<
asp:textbox
id
="txtRemark"
runat
="server"
></
asp:textbox
></
P
>
111
</
TD
>
112
</
TR
>
113
<
TR
>
114
<
TD
style
="HEIGHT: 25px"
>
115
<
P
align
="right"
><
asp:imagebutton
id
="ibtnAdd"
runat
="server"
ImageUrl
="../../Images/button_add.gif"
></
asp:imagebutton
><
asp:imagebutton
id
="ibtnDel"
runat
="server"
ImageUrl
="../../Images/button_del.gif"
></
asp:imagebutton
><
asp:imagebutton
id
="ibtnCancel"
runat
="server"
ImageUrl
="../../Images/button_cancel.gif"
></
asp:imagebutton
></
P
>
116
</
TD
>
117
</
TR
>
118
<
TR
>
119
<
TD
vAlign
="top"
>
120
<
DIV
align
="center"
><
asp:datagrid
id
="DataGrid1"
runat
="server"
AllowSorting
="True"
AllowPaging
="True"
HorizontalAlign
="Center"
121
PageSize
="15"
Width
="100%"
AutoGenerateColumns
="False"
BorderColor
="#CCCCCC"
BorderStyle
="None"
BorderWidth
="1px"
122
BackColor
="White"
CellPadding
="3"
>
123
<
SelectedItemStyle
Font-Bold
="True"
ForeColor
="White"
BackColor
="#669999"
></
SelectedItemStyle
>
124
<
ItemStyle
ForeColor
="Black"
></
ItemStyle
>
125
<
HeaderStyle
Font-Bold
="True"
HorizontalAlign
="Center"
ForeColor
="White"
BackColor
="#6766CC"
></
HeaderStyle
>
126
<
FooterStyle
ForeColor
="#000066"
BackColor
="#6766CC"
></
FooterStyle
>
127
<
Columns
>
128
<
asp:TemplateColumn
>
129
<
ItemStyle
HorizontalAlign
="Center"
></
ItemStyle
>
130
<
HeaderTemplate
>
131
<
INPUT
id
="CheckAll"
onclick
="ChooseAll()"
type
="checkbox"
name
="CheckAll"
>
132
</
HeaderTemplate
>
133
<
ItemTemplate
>
134
<
asp:CheckBox
id
="chkDel"
runat
="server"
></
asp:CheckBox
>
135
</
ItemTemplate
>
136
</
asp:TemplateColumn
>
137
<
asp:HyperLinkColumn
Target
="_self"
DataNavigateUrlField
="ClassID"
DataNavigateUrlFormatString
="Default.aspx?Module=SugarcaneClassInfoDetail&ClassID={0}&Mode=edit"
138
DataTextField
="ClassID"
SortExpression
="ClassID"
HeaderText
="编号"
>
139
<
HeaderStyle
Width
="10%"
CssClass
="HEADERSTYLE"
></
HeaderStyle
>
140
<
ItemStyle
CssClass
="ITEMSTYLEHYPERLINK"
></
ItemStyle
>
141
</
asp:HyperLinkColumn
>
142
<
asp:BoundColumn
Visible
="False"
DataField
="ClassID"
SortExpression
="ClassID"
HeaderText
="编号"
></
asp:BoundColumn
>
143
<
asp:BoundColumn
DataField
="ClassName"
SortExpression
="ClassName"
HeaderText
="品种名称"
>
144
<
HeaderStyle
Width
="30%"
></
HeaderStyle
>
145
</
asp:BoundColumn
>
146
<
asp:BoundColumn
DataField
="Price"
SortExpression
="Price"
HeaderText
="价格"
DataFormatString
="{0:F2}"
>
147
<
HeaderStyle
Width
="10%"
></
HeaderStyle
>
148
</
asp:BoundColumn
>
149
<
asp:BoundColumn
DataField
="Remark"
HeaderText
="备注"
>
150
<
HeaderStyle
Width
="28%"
></
HeaderStyle
>
151
</
asp:BoundColumn
>
152
<
asp:EditCommandColumn
ButtonType
="LinkButton"
UpdateText
="更新"
CancelText
="取消"
EditText
="编辑"
>
153
<
HeaderStyle
Width
="12%"
></
HeaderStyle
>
154
</
asp:EditCommandColumn
>
155
<
asp:ButtonColumn
Text
="<div οnclick="javascript:return confirm('确定删除吗?')">删除</div>"
156
CommandName
="Delete"
>
157
<
HeaderStyle
Width
="10%"
></
HeaderStyle
>
158
</
asp:ButtonColumn
>
159
</
Columns
>
160
<
PagerStyle
Visible
="False"
HorizontalAlign
="Left"
ForeColor
="#000066"
BackColor
="#EAEAEA"
Mode
="NumericPages"
></
PagerStyle
>
161
</
asp:datagrid
></
DIV
>
162
</
TD
>
163
</
TR
>
164
<
TR
>
165
<
TD
><
asp:label
id
="lblPageCount"
runat
="server"
></
asp:label
><
asp:label
id
="lblCurrentIndex"
runat
="server"
Width
="104px"
></
asp:label
><
asp:linkbutton
id
="btnFirst"
onclick
="PagerButtonClick"
runat
="server"
Font-Name
="verdana"
Font-size
="8pt"
166
CommandArgument
="0"
ForeColor
="navy"
></
asp:linkbutton
><
asp:linkbutton
id
="btnPrev"
onclick
="PagerButtonClick"
runat
="server"
Font-Name
="verdana"
Font-size
="8pt"
167
CommandArgument
="prev"
ForeColor
="navy"
></
asp:linkbutton
><
asp:linkbutton
id
="btnNext"
onclick
="PagerButtonClick"
runat
="server"
Font-Name
="verdana"
Font-size
="8pt"
168
CommandArgument
="next"
ForeColor
="navy"
></
asp:linkbutton
><
asp:linkbutton
id
="btnLast"
onclick
="PagerButtonClick"
runat
="server"
Font-Name
="verdana"
Font-size
="8pt"
169
CommandArgument
="last"
ForeColor
="navy"
></
asp:linkbutton
><
asp:label
id
="Label1"
runat
="server"
>
跳转:
</
asp:label
><
asp:textbox
id
="go"
Width
="20px"
BorderColor
="#9999FF"
BorderWidth
="1px"
BackColor
="White"
AutoPostBack
="True"
170
OnTextChanged
="goClick"
Runat
="server"
></
asp:textbox
></
TD
>
171
</
TR
>
172
</
TABLE
>
173
</
FONT
>
174
</
P
>
175



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

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175
