| 在学习DataGrid控件和DataList控件后，我们知道，DataGrid控件对数据输出格式是自动生成HtmlTable标记的，DataList控件也是这样，它根据数据内容来生成数据控制表格。而Repeater 控件是模板化的数据绑定列表，Repeater 控件是“无外观的”，即：它不具有任何内置布局或样式，也就不会产生任何数据控制表格来控制数据的显示。因此，我们必须在控件的模板中明确声明所有 HTML 布局标记、格式标记和样式标记。 在第一节里我们也说过Repeater控件是个轻量级的数据绑定控件，一般用它来输出要求相对简单的数据，下面，我们利用这个控件，做一个简单的留言板。在这个留言板里，我们充分利用Repeater控件的控能，进行数据显示，数据分页，嵌入控件响应事件等等。 首先，利用Access2003新建一个GuestbookData.mdb数据库，包含一个数据表GuestMessage，数据表字段属性如图9.16所示。
图9.16 GuestMessage数据表的字段属性
一个功能完善的留言板应包括三个主要内容：
（1）、留言浏览
（2）、发表留言
（3）、留言管理（回复，删除。有的还要求有审核功能） 我们来根据这三个功能来详细介绍我们这个实例的编写。 在DataCon Web 项目中新增一个WebForm窗体，命名为Repeater_Sample.aspx，添加一个Repeater控件，ID=“Repeater1”；三个Panel控件，三个Panel控件的ID分别是“login”，“reply”和“write”。 首先我们来看“留言浏览”功能的HTML布局代码。在“留言浏览”部分我们要应用Repeater控件，该控件的属性列、绑定设置以及嵌入控件属性如下，注意绑定数据的使用： <TABLE id="Table2" style="WIDTH: 384px; TR: "
cellSpacing="0" cellPadding="0" width="384"
align="left" border="0">
<TBODY>
<TR borderColor="#009900">
<td><asp:linkbutton id="say" Runat="server">我要说两句</asp:linkbutton></td>
</TR>
<TR>
<TD>
<asp:repeater id="Repeater1" runat="server">
<ItemTemplate>
<table width="400" border="1"
cellpadding="0" cellspacing="0"
bordercolor="#009966" style="FONT-SIZE: 12px">
<tr>
<td width="100" height="20">
昵称：<%# databinder.eval(container.dataitem,"name" ) %></td>
<td width="300">
这是 <b><%# databinder.eval(container.dataitem,"name" ) %>
</b><%# databinder.eval(container.dataitem,"sex" ) %>于[<%# databinder.eval(container.dataitem,"senddate").tostring %>]的留言</td>
</tr>
<tr>
<td><%# "<img width=50 height=90 src ="+databinder.eval(container.dataitem,"face")+">" %></td>
<td><%# databinder.eval(container.dataitem,"content") %></td>
</tr>
<tr>
<td><%# "<img src=image/ip.gif alt=IP:"+ databinder.eval(container.dataitem,"ip")+" >" %>
<%# databinder.eval(container.dataitem,"ip") %>
</td><td>
<%# "<a href=mailto:" & DataBinder.Eval(Container.DataItem,"Email") & ">给他发邮件</a>" %>
<asp:LinkButton Runat=server CommandName ="del" CommandArgument= '<%# DataBinder.Eval(Container.DataItem,"ID") %>' ID="Linkbutton1" NAME="Linkbutton1">删除留言</asp:LinkButton>
<asp:LinkButton Runat=server CommandName ="reply" CommandArgument= '<%# DataBinder.Eval(Container.DataItem,"ID") %>' ID="Linkbutton2" NAME="Linkbutton1">回复留言</asp:LinkButton>
</tr>
</table>
</ItemTemplate>
<SeparatorTemplate>
<table width="400" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="400" background="image/bg01.gif"></td>
</tr>
</table>
</SeparatorTemplate>
</asp:repeater></TD>
</TR>
<TR borderColor="#009900">
<TD class="style2" style="FONT-SIZE: 12px" borderColor="#009900" align="right" colSpan="2"><asp:label id="pagesinfor" runat="server" Font-Size="X-Small"></asp:label>/<asp:linkbutton id="prevpage" runat="server" Font-Size="X-Small">[上一页]</asp:linkbutton>
<asp:linkbutton id="nextpage" runat="server" Font-Size="X-Small">[下一页] </asp:linkbutton>跳转至第 <asp:dropdownlist id="pageslist" runat="server" AutoPostBack="True"></asp:dropdownlist>页
</TD>
</TBODY>
</TABLE> 在上面的一段HTML标记布局中，我们已经对Repeater控件做了详细的设置。我们利用Panel控件对其显示与隐藏进行控制。默认情况下“签写留言”功能模块是不可见的，即Panel控件（id="write"）的Visible属性为”False”，只有单击“我要说两句”后才能显示。下面来看具体的HTML布局代码如下： <asp:panel id="write"
runat="server" Visible="False" Width="208px">
<TABLE style="FONT-SIZE: 12px; WIDTH: 384px" cellSpacing="0" cellPadding="0" width="384" border="1">
<TR>
<TD style="WIDTH: 59px"> <FONT face="宋体">昵称</FONT></TD>
<TD style="WIDTH: 214px">
<asp:TextBox id="name" runat="server"></asp:TextBox></TD>
<TD rowSpan="3">
<asp:Image id="Image1" runat="server" Width="96px" Height="80px"></asp:Image></TD>
</TR>
<TR>
<TD style="WIDTH: 59px"> <FONT face="宋体">选择头像</FONT></TD>
<TD style="WIDTH: 214px">
<asp:DropDownList id="DropDownList1" runat="server" AutoPostBack="True">
<asp:ListItem Value="image/face/001.gif">帅哥－001</asp:ListItem>
<asp:ListItem Value="image/face/002.gif">帅哥－002</asp:ListItem>
<asp:ListItem Value="image/face/003.gif">帅哥－003</asp:ListItem>
<asp:ListItem Value="image/face/004.gif">帅哥－004</asp:ListItem>
<asp:ListItem Value="image/face/005.gif">帅哥－005</asp:ListItem>
<asp:ListItem Value="image/face/006.gif">帅哥－006</asp:ListItem>
<asp:ListItem Value="image/face/007.gif">美女－007</asp:ListItem>
<asp:ListItem Value="image/face/009.gif">美女－008</asp:ListItem>
<asp:ListItem Value="image/face/009.gif">美女－009</asp:ListItem>
<asp:ListItem Value="image/face/010.gif">美女－010</asp:ListItem>
<asp:ListItem Value="image/face/011.gif">美女－011</asp:ListItem>
<asp:ListItem Value="image/face/012.gif">美女－012</asp:ListItem>
</asp:DropDownList></TD>
</TR>
<TR>
<TD style="WIDTH: 59px"> <FONT face="宋体">电邮</FONT></TD>
<TD style="WIDTH: 214px">
<asp:TextBox id="email" runat="server"></asp:TextBox></TD>
</TR>
<TR>
<TD style="WIDTH: 59px"> <FONT face="宋体">留言内容</FONT></TD>
<TD style="WIDTH: 214px">
<asp:TextBox id="message" runat="server" Width="192px" Height="92px" TextMode="MultiLine"></asp:TextBox></TD>
<TD> </TD>
</TR>
<TR>
<TD style="WIDTH: 59px"> </TD>
<TD style="WIDTH: 214px">
<asp:Button id="Button2" runat="server" Width="96px" Text="写好啦"></asp:Button></TD>
<TD> </TD>
</TR>
</TABLE>
</asp:panel> 最后是“留言管理”功能，包括留言的“回复”和“删除”。“留言管理”首先要有权限管理，有了管理员的权限后才能进行留言管理。所以必须要有管理员登录窗口，我们利用Panel控件（ID=”login”）进行控制它的显示于隐藏，默认是隐藏。具体HTML代码如下： <asp:panel id="login" runat="server"
Visible="False" Width="336px" Height="32px"
BackColor="Moccasin">请输入管理员密码：
<asp:TextBox id="adminpwd" runat="server" Width="96px"> </asp:TextBox>
<asp:Button id="Button1" runat="server" Text="确认密码"> </asp:Button>
</asp:panel> 当有了系统管理员权限后，就可以进行管理了，在“留言浏览”功能里面我们已经集成了“回复”和“删除”的链接，只要我们在后台逻辑代码中稍加编码就可以实现“回复”和“删除”的功能。这里我们只剩“回复”功能没有完成。我们来看回复功能的实现。 我们仍是利用Panel控件来控制该功能模块的显示和隐藏，系统默认的是不可见的。具体HTML布局编码如下： <asp:panel id="reply" runat="server" Visible="False" Width="168px" Height="48px">
<TABLE id="Table1" cellSpacing="1" cellPadding="1" width="300" border="1">
<TR>
<TD style="WIDTH: 60px; HEIGHT: 74px"><FONT face="宋体">回复内容</FONT></TD>
<TD style="HEIGHT: 74px"><FONT face="宋体">
<asp:TextBox id="replymsg" runat="server"
Width="231px" Height="56px" TextMode="MultiLine"> </asp:TextBox>
</FONT></TD>
</TR>
<TR>
<TD style="WIDTH: 60px"></TD>
<TD>
<asp:Button id="Button3" runat="server" Text="就这样回复吧"> </asp:Button>
</TD>
</TR>
</TABLE>
</asp:panel> 通过上面的几段Html布局编码，我们已经分模块完成了Repeater_Sample.aspx页面的HTML编码部分，为了节约篇幅，我们不再整合到一起。 下面我们来编写它的逻辑代码部分，便于整体理解，我们不再按模块分列逻辑代码，请读者注意控件事件过程与HTML布局中的控件ID对应，在逻辑代码中已经给出了详细的解释。 Repeater_Sample.aspx.vb中的逻辑代码如下： '-----code begin-----
'----省略命名空间引用
Public Class Repeater_Sample
Inherits System.Web.UI.Page
#Region " Web 窗体设计器生成的代码 "
'省略窗体设计器生成的代码
#End Region
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
'在此处放置初始化页的用户代码
If Not IsPostBack Then
Image1.ImageUrl = DropDownList1.SelectedValue
viewstate("constr") = "provider=microsoft.jet.oledb.4.0;data source=" + Server.MapPath(".") + "\GuestbookData.mdb"
'初始化页码和每页显示的记录数(, 并用Viewstate类保存)
'这里我们使用Session类保存一些维护状态信息的变量，我们也可以用Viewstate类来保存
'Session("startpage")起始页码
'Session("pagesize")是每页显示留言条数
' Session("pagecount")是统计总页数，
Session("startpage") = 1
Session("pagesize") = 2
Session("pagecount") = 0
getpagecount()
getdata()
End If
End Sub
'数据绑定过程
Sub getdata()
Dim mycon As OleDb.OleDbConnection
mycon = New OleDb.OleDbConnection(viewstate("constr"))
Dim mycmd As OleDb.OleDbDataAdapter
mycmd = New OleDb.OleDbDataAdapter("select * from GuestMessage order by id desc", mycon)
Dim
dt As DataSet = New DataSet
mycmd.Fill(dt, Session("startpage") - 1, Session("pagesize"), "guestbook")
Repeater1.DataSource = dt.Tables("guestbook").DefaultView
Repeater1.DataBind()
'显示留言版状态信息
pagesinfor.Text = "当前第" & CStr(Session("startpage")) & "页/ 共" & Session("pagecount") & "页"
'更新下拉列表
pageslist.SelectedIndex = Session("startpage") - 1
End Sub
'统计页码数
Sub getpagecount()
Dim mycon As OleDb.OleDbConnection = New OleDb.OleDbConnection(viewstate("constr"))
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand("Select count(*) from GuestMessage", mycon)
Session("pagecount") = mycmd.ExecuteScalar \ Session("pagesize") + 1
mycon.Close()
Dim i As Int16
'清楚下拉列表中的项
'加载新的项
pageslist.Items.Clear()
For i = 1 To Session("pagecount")
pageslist.Items.Add(i.ToString)
Next
pageslist.SelectedIndex = Session("startpage") - 1
End Sub
'数据绑定过程结束
Private Sub DropDownList1_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
'动态加载头像图片
Image1.ImageUrl = DropDownList1.SelectedValue
End Sub
'Button2的Click过程就是增加留言过程
Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click
Dim mycon As OleDb.OleDbConnection = New OleDb.OleDbConnection(viewstate("constr"))
Dim mysql As String
Dim uname As String
Dim uemail As String
Dim usex As String
Dim uface As String
Dim msg As String
If name.Text <> "" Then
'替换掉SQL语句中的关键字符，如果不替换会引起SQL语句执行错误
uname = name.Text.Replace("'", "")
Else
'弹出对话框提示信息！
Response.Write("<script>alert(对不起！\n您的昵称忘记填写了！');</script>")
'退出该事件的执行
Exit Sub
End If
If email.Text <> "" Then
uemail = email.Text.Replace("'", "")
Else
'弹出对话框提示信息！
Response.Write("<script>alert(对不起！\n您的邮件地址忘记填写了！');</script>")
End If
usex = DropDownList1.SelectedItem.Text.Substring(0, 2)
msg = message.Text.Replace("'", """).Replace("<", "<").Replace(">", "&rt;").Replace("&", "&")
msg = msg.Replace(vbCrLf, "<br> ")
'把VB.NET中的换行转化为Html里的"<br>"标记
mysql = "INSERT INTO GuestMessage(name,sex,email,face,ip,senddate,content) VALUES("
mysql += "'" + uname + "',"
mysql += "'" + DropDownList1.SelectedItem.Text.Substring(0, 2) + "',"
mysql += "'" + uemail + "',"
mysql += "'" + DropDownList1.SelectedValue.ToString + "',"
mysql += "'" + Request.UserHostAddress.ToString() + "', "
mysql += "#" + CStr(DateTime.Now) + "#,"
mysql += "'" + msg + "')"
Try
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
Catch ex As Exception
Response.Write("程序出错，信息描述如下：<br>" & ex.Message)
Finally
mycon.Close()
'弹出对话框提示信息！
Response.Write("<script>alert('恭喜您\n 留言成功！');</script>")
'新增记录，需要更新留言版状态信息
getpagecount()
'刷新数据
getdata()
write.Visible = False
'关闭留言版面
End Try
End Sub
'管理员登陆事件过程
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
If adminpwd.Text = "12345" Then
'默认管理员密码为adminpwd
Session("admin") = "admin"
'弹出对话框提示信息！
Response.Write("<script>alert('恭喜您！\n成功登录！ ');</script>")
login.Visible = False
Else
'弹出对话框提示信息！
Response.Write("<script>alert('对不起！\n密码错误，请重试！ ');</script>")
Exit Sub
End If
getdata()
End Sub
' 管理员回复事件过程
Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click
Dim mycon As OleDb.OleDbConnection = New OleDb.OleDbConnection(viewstate("constr"))
Dim reply_msg As String
reply_msg = replymsg.Text.Replace("'", " "").Replace("<", "<").Replace(">", "&rt;").Replace("&", "&")
reply_msg = reply_msg.Replace(vbCrLf, "<br> ")
reply_msg = " <hr width=90% bgcolor=red><br> <font color=red> 管理员于" & CStr(DateTime.Now) & "的回复：</font> <br>" + reply_msg + "<br>"
Dim mysql As String
mysql = "UPDATE GuestMessage SET content=content + '" + reply_msg + "' where id=" & viewstate("replyid")
Try
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
Catch ex As Exception
Response.Write("程序出错，信息描述如下：<br>" & ex.Message)
Finally
mycon.Close()
'弹出对话框提示信息！
Response.Write("<script>alert('恭喜您\n 回复成功！');</script>")
getdata()
reply.Visible = False
'关闭回复面板
End Try
End Sub
' 显示留言面板
Private Sub say_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles say.Click
write.Visible = True
End Sub
' 管理员实施管理功能
Private Sub Repeater1_ItemCommand(ByVal source As System.Object, ByVal e As System.Web.UI.WebControls.RepeaterCommandEventArgs) Handles Repeater1.ItemCommand
If Session("admin") <> "admin" Then
'检查权限
login.Visible = True
Exit Sub
End If
If e.CommandName = "del" Then
'如果是删除，则调用删除过程，
'传递的参数是由LinkButton控件CommandArgument值，即记录ID
delmsg(CInt(e.CommandArgument))
End If
If e.CommandName = "reply" Then
'如果是回复，显示回复面板，使用Viewstate保存记录ID
reply.Visible = True
viewstate("replyid") = CInt(e.CommandArgument)
End If
End Sub
'以下是删除留言的通用过程，参数是留言的ID编号
Sub delmsg(ByVal id As Integer)
Dim mycon As OleDb.OleDbConnection = New OleDb.OleDbConnection(viewstate("constr"))
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand("delete from GuestMessage where id=" & id, mycon)
mycon.Open()
mycmd.ExecuteNonQuery()
mycon.Close()
Response.Write("<script>alert('恭喜您\n 删除成功！');</script>")
getdata()
viewstate.Remove("replyid")
End Sub
'删除留言过程结束！
'pageslist_SelectedIndexChanged过程即是跳转页面过程
Private Sub pageslist_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles pageslist.SelectedIndexChanged
Session("startpage") = pageslist.SelectedValue
getdata()
End Sub
Private Sub prevpage_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles prevpage.Click
'添加判断，预防页码越界
If Session("startpage") > 1 Then
Session("startpage") -= 1
getdata()
End If
End Sub
Private Sub nextpage_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles nextpage.Click
'添加判断，预防页码越界
If Session("startpage") < Session("pagecount") Then
Session("startpage") += 1
getdata()
End If
End Sub
End Class 保存编译后，Repeater_Sample.aspx各功能模块运行效果如图9.17～9.19所示。
图9.17 Repeater_Sample.aspx的留言浏览功能
图9.18 Repeater_Sample.aspx的留言签写功能
图9.19 Repeater_Sample.aspx的留言回复功能
9.6 本章小结 本章主要介绍了ASP.NET编程中的数据绑定控件――DataGrid控件，DataList控件和Repeater控件。 在这三个控件中,DataGrid控件是功能最为强大的控件，也是我们常用的控件，利用它的属性设置就可以轻而易举的实现数据的分页功能，在线编辑功能等等。其次是DataList控件，该控件的最大特点是可以分列显示数据，并且对数据模板设置的支持也很完善，可以控制输出用户感兴趣的数据。最后一个轻量级的数据绑定控件Repeater，它在输出数据时候不会添加任何控制标记，也因此需要我们手工编写数据控制代码，该控件适合用于数据结构简单，要求功能简单的数据环境中。 在下面一章中，我们开始学习ASP.NET技术中的文件操作技术。 |
|
微信便捷交流