一、Repeater控件的用法流程及实例:
1、首先建立一个网站,新建一个网页index.aspx。
2、添加或者建立APP_Data数据文件,然后将用到的数据库文件放到APP_Data文件夹中。
3、打开数据库企业管理器,数据库服务器为local(.),然后将APP_Data文件夹中的数据库附加到数据库服务器中。
4、添加Ling to SQL类。
5、打开视图,服务器资源管理器,右击数据库服务器,选择添加连接,然后选择数据库服务器、数据库类型,及数据库表,然后完成。
6、将需要用到的表,全部选中,然后拖动到.dbml为后缀的文件中,然后保存。到这一步,数据表的附加及与网站的连接就完成了。
目标:通过使用Repeater数据控件,让数据表中的数据在表格中显示。
1、添加样式文件,然后在样式文件中,书写表格的样式代码。
2、在index.aspx的设计模式下,插入表格,通常插入两行(一行为标题行,一行为内容行),因为Repeater控件会自动循环的。然后在源代码界面中,将刚插入的表格的第一行的单元格改为,标题单元格,即将<td>改为<th>。
3、选中表格,然后选择格式,然后选择附加样式表。接下来,需要将源代码中的头部中样式代码删除,将行样式删除,并且书写新建的样式表中的类或这ID到表格中。
4、然后,将光标放到table前面,双击repeater控件,这样Repeater控件的代码就添加到了Table代码的前面,然后分别为Repeater控件添加头部模版(<HeaderTemplate></HeaderTemplate> )、列表模版(<ItemTemplate></ItemTemplate>)和尾部模版( <FooterTemplate> </FooterTemplate>)。
注意:
头部模版放置表格开始及第一行标题行(<table><tr><th></th></tr>);列表模版放置表格第二行(<tr></tr>);尾部模版放置表个结束(</table>)。
插入表格时只需插入两行即可,显示数据时是根据数据库表循环显示的。项目模板,会进行循环显示,放置表格第二行。
5、然后在标题行的单元格中书写将要显示的数据库中字段的别名,在内容行的单元格中书写数据库中的字段名,方式为:
1
|
<td><%#Eval( "数据库字段名" ) %></td>
|
核心代码为:
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
|
<body>
<form id= "form1" runat= "server" >
<div>
<!--光标放到table前面,双击repeater控件,三个缺一不可-->
<asp:Repeater ID= "Repeater1" runat= "server" >
<HeaderTemplate><!--头部模板,放表格开始及第一行标题-->
<table class = "ts" ><!--插入表格时只需插入两行即可,显示数据时是根据数据库表循环显示的-->
<tr>
<th>
学号</th>
<th>
姓名</th>
<th>
性别</th>
<th>
籍贯</th>
<th>
年龄</th>
</tr></HeaderTemplate>
<ItemTemplate><!--项目模板,会进行循环显示,放置表格第二行-->
<tr>
<td>
<%#Eval( "number" ) %> <!--HTMl中插入其他代码需要用<% %>括起来,Eval( "数据库中的字段名" )-->
</td>
<td>
<%#Eval( "name" )%> </td>
<td>
<%#Eval( "sex" )%> </td>
<td>
<%#Eval( "place" )%></td>
<td>
<%#Eval( "age" )%> </td>
</tr>
</ItemTemplate>
<FooterTemplate><!--底部模板-->
</table> <!--表格结束部分-->
</FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
|
注意:
HTMl中插入其他代码需要用<% %>括起来。
6、然后在index.aspx.cs的Page_Load()事件中绑定数据源。
核心代码为:
1
2
3
4
5
6
7
8
9
10
11
|
public partial class citynumber : System.Web.UI.Page
{
DataClassesDataContext dc = new DataClassesDataContext();
protected void Page_Load( object sender, EventArgs e)
{
var query = from c in dc.city select c;
Repeater1.DataSource = query;
Repeater1.DataBind();
}
}
|
7、运行index.aspx页面即可看到数据库中各字段信息。
二、通过Table显示数据库中的字段时,为字段添加超链接。
1、新建两个页面,index.aspx 页面和Cities.aspx页面。
index.aspx页面代码:
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
|
<body>
<asp:Repeater ID= "Repeater1" runat= "server" >
<HeaderTemplate>
<table class = "ts" >
<tr>
<th>
省份名称</th>
<th>
省份编号</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<a href= 'Cities.aspx?pro=<%#Eval("proID") %>' target= "_blank" ><%#Eval( "proName" ) %></a></td><!--添加超链接,超链接放到内容的两边-->
<td>
<%#Eval( "proID" )%></td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
<form id= "form1" runat= "server" >
<div>
</div>
</form>
</body>
|
index.aspx.cs中的代码:
1
2
3
4
5
6
7
8
9
10
11
|
public partial class index : System.Web.UI.Page
{
DataClassesDataContext dc = new DataClassesDataContext();
protected void Page_Load( object sender, EventArgs e)
{
var query = from c in dc.province select c;
Repeater1.DataSource = query;
Repeater1.DataBind();
}
}
|
Cities.aspx页面中的代码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<body>
<form id= "form1" runat= "server" >
<div>
<asp:GridView ID= "GridView1" runat= "server" CellPadding= "4" ForeColor= "#333333"
GridLines= "None" Width= "909px" >
<FooterStyle BackColor= "#507CD1" Font-Bold= "True" ForeColor= "White" />
<RowStyle BackColor= "#EFF3FB" />
<PagerStyle BackColor= "#2461BF" ForeColor= "White" HorizontalAlign= "Center" />
<SelectedRowStyle BackColor= "#D1DDF1" Font-Bold= "True" ForeColor= "#333333" />
<HeaderStyle BackColor= "#507CD1" Font-Bold= "True" ForeColor= "White" />
<EditRowStyle BackColor= "#2461BF" />
<AlternatingRowStyle BackColor= "White" />
</asp:GridView>
</div>
</form>
</body>
|
Cities.aspx.cs页面中的代码:
1
2
3
4
5
6
7
8
9
10
11
12
|
public partial class Cities : System.Web.UI.Page
{
DataClassesDataContext dc = new DataClassesDataContext();
protected void Page_Load( object sender, EventArgs e)
{
int id =Convert.ToInt32(Request.QueryString[ "pro" ].ToString());
var query = from c in dc.city where c.proID == id select c;
GridView1.DataSource = query;
GridView1.DataBind();
}
}
|
然后运行index.aspx页面,通过单击超链接就跳转到了Cities.aspx,在该页面显示信息。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。
原文链接:http://www.cnblogs.com/fengzheng126/archive/2012/05/07/2487355.html