经过前面系统分析和数据库设计,文章管理系统的基本设计环境已经建立起来了,按照管理信息系统设计的环节,现在已经进入了系统实施阶段。本系统拟采用Visual Studio.NET2003设计。使用Visual Studio.NET2003新建一个Web应用程序 ，命名为TheArticleSYS，具体步骤略。下面，我们按照数据信息积累分先后顺序详细介绍本系统的设计与编写。首先是后台管理部分，然后是前台浏览和检索部分。
14.3.1 Admin_Management.aspx的设计与编码
为了系统界面更加紧凑，我们把后台管理部分的文章分类管理功能模块和文章信息管理功能模块集成到Admin_Management.aspx窗体内，并提供了文章发布的入口。
Admin_Management.aspx窗体的前台HTML代码如下：
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="Admin_Management.aspx.vb" Inherits="TheArticleSYS.Admin_Management"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>Admin_Management</title>
<meta name="vs_snapToGrid" content="True">
<meta name="vs_showGrid" content="True">
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<center>
<table>
<tr>
<td style="FONT-WEIGHT: bold; FONT-SIZE: 16pt; COLOR: white; HEIGHT: 50px; BACKGROUND-COLOR: #009999; TEXT-ALIGN: center">管理员管理窗口</td>
<tr>
<td width="762" align="center" style="BORDER-RIGHT: #009999 1pt solid; BORDER-TOP: #009999 1pt solid; BORDER-LEFT: #009999 1pt solid; BORDER-BOTTOM: #009999 1pt solid">
<form id="Form1" method="post" runat="server">
<asp:Panel id="Panel1" runat="server">
<TABLE id="Table1" cellSpacing="1" cellPadding="1" width="500" border="1">
<TR>
<TD><FONT face="宋体">管理员ID</FONT></TD>
<TD>
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox></TD>
</TR>
<TR>
<TD><FONT face="宋体">密码</FONT></TD>
<TD>
<asp:TextBox id="TextBox2" runat="server" TextMode="Password"></asp:TextBox></TD>
</TR>
<TR>
<TD align="center" colSpan="2">
<asp:Button id="Button1" runat="server" Text="登录"></asp:Button></TD>
</TR>
</TABLE>
</asp:Panel>
<asp:Panel id="Panel2" runat="server" Visible="False">
<asp:Button id="Button3" runat="server" Text="文章类别管理 " Height="32px"></asp:Button>
<asp:Button id="Button4" runat="server" Text="文章信息管理" Height="32px" Width="120px"></asp:Button>
<FONT face="宋体"><a href="Add_Articles.aspx" target="_blank">发布新文章</a></FONT>
</asp:Panel>
<asp:Panel id="Panel3" runat="server" Visible="False">
<TABLE id="Table3" cellSpacing="1" cellPadding="1" width="758" border="1">
<TR>
<TD style="FONT-SIZE: 11pt"><FONT face="宋体">按类别分类</FONT>
<asp:DropDownList id="DropDownList1" runat="server" Width="80px" AutoPostBack="True"></asp:DropDownList><FONT face="宋体"> 按标题检索</FONT>
<asp:TextBox id="TextBox4" runat="server"></asp:TextBox>
<asp:DropDownList id="DropDownList2" runat="server">
<asp:ListItem Value="0" Selected="True">模糊标题查找</asp:ListItem>
<asp:ListItem Value="1">精确标题查找</asp:ListItem>
</asp:DropDownList>
<asp:Button id="Button5" runat="server" Text="GoSearch"></asp:Button></TD>
</TR>
<TR>
<TD style="HEIGHT: 21px">
<asp:DataGrid id="DataGrid2" runat="server" Height="312px" Width="752px" AutoGenerateColumns="False"
BorderWidth="1px" BorderColor="#CCCCCC" BackColor="White" BorderStyle="None" CellPadding="3"
AllowPaging="True" Font-Size="X-Small">
<SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#669999"></SelectedItemStyle>
<ItemStyle ForeColor="#000066"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="White" BackColor="#006699"></HeaderStyle>
<FooterStyle ForeColor="#000066" BackColor="White"></FooterStyle>
<Columns>
<asp:BoundColumn DataField="id" ReadOnly="True" HeaderText="编号"></asp:BoundColumn>
<asp:BoundColumn DataField="title" HeaderText="文章标题"></asp:BoundColumn>
<asp:BoundColumn DataField="writer" ReadOnly="True" HeaderText="作者"></asp:BoundColumn>
<asp:BoundColumn DataField="sdate" ReadOnly="True" HeaderText="发布时间"></asp:BoundColumn>
<asp:EditCommandColumn ButtonType="LinkButton" UpdateText="更新" HeaderText="标题修改" CancelText="取消" EditText="编辑"></asp:EditCommandColumn>
<asp:ButtonColumn Text="删除" HeaderText="删除文章" CommandName="Delete"></asp:ButtonColumn>
</Columns>
<PagerStyle HorizontalAlign="Left" ForeColor="#000066" BackColor="White" Mode="NumericPages"></PagerStyle>
</asp:DataGrid></TD>
</TR>
<TR>
<TD><FONT face="宋体"></FONT></TD>
</TR>
</TABLE>
</asp:Panel>
<asp:Panel id="Panel4" runat="server" Visible="False">
<TABLE id="Table2" cellSpacing="1" cellPadding="1" width="758" border="1">
<TR>
<TD style="HEIGHT: 173px"><FONT face="宋体"></FONT>
<asp:DataGrid id="DataGrid1" runat="server" Height="176px" Width="752px" AutoGenerateColumns="False"
BorderWidth="1pt" BorderColor="#009999" Font-Size="X-Small">
<AlternatingItemStyle Font-Size="X-Small" BackColor="GhostWhite"></AlternatingItemStyle>
<ItemStyle Font-Size="X-Small"></ItemStyle>
<HeaderStyle Font-Size="Larger" Font-Bold="True" ForeColor="White" BackColor="#003399"></HeaderStyle>
<Columns>
<asp:BoundColumn DataField="id" ReadOnly="True" HeaderText="编号"></asp:BoundColumn>
<asp:BoundColumn DataField="akinds" HeaderText="类别"></asp:BoundColumn>
<asp:EditCommandColumn ButtonType="PushButton" UpdateText="更新" HeaderText="修改" CancelText="取消" EditText="修改"></asp:EditCommandColumn>
<asp:ButtonColumn Text="删除" ButtonType="PushButton" HeaderText="删除" CommandName="Delete"></asp:ButtonColumn>
</Columns>
</asp:DataGrid></FONT></TD>
</TR>
<TR>
<TD>添加新的文章类别
</TD>
</TR>
<TR>
<TD>新类别名称
<asp:TextBox id="TextBox3" runat="server" Width="64px"></asp:TextBox>
<asp:Button id="Button2" runat="server" Text="添加" Width="72px"></asp:Button></TD>
</TR>
</TABLE>
</asp:Panel>
</form>
</td>
</tr>
</table>
</center>
</body>
</HTML>
简要说明：进入后台管理首先要进行身份验证，如果身份合法才能被允许进入。我们采用了Panel控件的Visible属性来控制对管理项的控制。在逻辑代码块中已经对部分过程和语句做了注释，Admin_Management.aspx.vb的逻辑代码如下：
‘code begin
‘引入命名空间，在使用Visual Studio.NET 2003编写Web引用程序时候，可以不进行命名空间的引入
‘但是在使用类对象时必须是类名称的完全引用。如：System.Web.UI.WebControls.DataGrid
Imports System
Imports System.Web
Imports System.Data
Public Class Admin_Management
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
‘在此处放置初始化页的用户代码
‘如果Session中没有保存管理员的登陆信息, 则表示未登录或是登陆超时
If Session("admin") = "" Then Panel1.Visible = True
End Sub
‘从数据库中获取文章分类信息
Sub getdata1()
mysql = "select * from akinds order by id asc "
Dim mycmd As OleDb.OleDbDataAdapter = New OleDb.OleDbDataAdapter(mysql, mycon)
Dim dt As DataSet = New DataSet
mycmd.Fill(dt)
DataGrid1.DataSource = dt.Tables(0).DefaultView
DataGrid1.DataBind()
End Sub
‘从数据库中获取文章信息
Sub getdata2()
Dim mycmd As OleDb.OleDbDataAdapter = New OleDb.OleDbDataAdapter(viewstate("sql"), mycon)
Dim dt As DataSet = New DataSet
mycmd.Fill(dt)
DataGrid2.DataSource = dt
DataGrid2.DataBind()
End Sub
‘文章类别管理--激活更新状态，分类名称列为可编辑列
Private Sub DataGrid1_EditCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.EditCommand
DataGrid1.EditItemIndex = e.Item.ItemIndex
getdata1()
End Sub
‘文章类别管理--去消管理
Private Sub DataGrid1_CancelCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.CancelCommand
DataGrid1.EditItemIndex = -1
getdata1()
End Sub
‘文章类别管理 类别信息更新过程
Private Sub DataGrid1_UpdateCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.UpdateCommand
mysql = "update akinds set akinds=‘" + CType(e.Item.Cells(1).Controls(0), TextBox).Text + "‘ where id=" + e.Item.Cells(0).Text
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
mycon.Close()
Response.Write("<script>alert(‘\n恭喜您,修改成功!!\n‘);</script>")
DataGrid1.EditItemIndex = -1
getdata1()
End Sub
‘文章类别管理--文章类别添加
Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click, Button2.Click
If TextBox3.Text <> "" Then
mysql = "insert into akinds(akinds) values(‘" + TextBox3.Text + "‘)"
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
mycon.Close()
Response.Write("<script>alert(‘\n恭喜您,添加成功!!\n‘);</script>")
TextBox3.Text = ""
getdata1()
End If
End Sub
‘文章类别管理---删除文章类别
Private Sub DataGrid1_DeleteCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid1.DeleteCommand
If e.CommandName = "Delete" Then
mysql = "delete from akinds where id=" + e.Item.Cells(0).Text
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
mycon.Close()
Response.Write("<script>alert(‘\n恭喜您,删除成功!!\n‘);</script>")
TextBox1.Text = ""
getdata1()
End If
End Sub
‘系统登录过程
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
‘通过ConfigurationSettings.AppSettings("AdminID")获取Web.config配置文件信息中的管理员ID
If TextBox1.Text = ConfigurationSettings.AppSettings("AdminID") Then
‘通过ConfigurationSettings.AppSettings("PassWord")获取Web.config配置文件信息中的管理员密码
If TextBox2.Text = ConfigurationSettings.AppSettings("PassWord") Then
Session("admin") = "admin"
Response.Write("<script>alert(‘恭喜您,您已经成功登录后台管理系统!‘);</script>")
Panel2.Visible = True
Panel1.Visible = False
Else
Response.Write("<script>alert(‘对不起,您的密码有误,请核实后重试!‘);</script>")
End If
Else
Response.Write("<script>alert(‘对不起,您的ID有误,请核实后重试!‘);</script>")
End If
End Sub
‘文章信息管理--激活更新按钮，文章标题列为可编辑列
Private Sub DataGrid2_ItemCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid2.ItemCommand
DataGrid2.EditItemIndex = e.Item.ItemIndex
getdata2()
End Sub
‘文章类别管理---显示所有文章类别信息
Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click
Panel3.Visible = False
Panel4.Visible = True
getdata1()
End Sub
‘文章信息管理--显示所有文章信息
Private Sub Button4_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button4.Click
Panel4.Visible = False
Panel3.Visible = True
viewstate("sql") = "select id,title,writer,sdate from articles order by id desc"
getdata2()
getaidlist()
End Sub
‘ 文章信息管理--翻页过程
Private Sub DataGrid2_PageIndexChanged(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridPageChangedEventArgs) Handles DataGrid2.PageIndexChanged
DataGrid2.CurrentPageIndex = e.NewPageIndex
getdata2()
End Sub
‘文章信息管理--更新过程
Private Sub DataGrid2_UpdateCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid2.UpdateCommand
mysql = "update articles set title=‘" + CType(e.Item.Cells(1).Controls(0), TextBox).Text + "‘ where id=" + e.Item.Cells(0).Text
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
mycon.Close()
Response.Write("<script>alert(‘\n恭喜您,修改成功!!\n‘);</script>")
DataGrid2.EditItemIndex = -1
getdata2()
End Sub
‘去消文章信息管理
Private Sub DataGrid2_CancelCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid2.CancelCommand
DataGrid2.EditItemIndex = -1
getdata2()
End Sub
‘文章信息管理--删除文章
Private Sub DataGrid2_DeleteCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) Handles DataGrid2.DeleteCommand
mysql = "delete from articles where id=" + e.Item.Cells(0).Text
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
mycon.Close()
Response.Write("<script>alert(‘\n恭喜您,删除成功!!\n‘);</script>")
DataGrid2.EditItemIndex = -1
getdata2()
End Sub
‘从数据库中获取文章分类信息，并逐一加载到下拉列表框中。
Sub getaidlist()
mysql = "select * from akinds order by id asc "
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
Dim myreader As OleDb.OleDbDataReader
myreader = mycmd.ExecuteReader
DropDownList1.Items.Clear()
Do While myreader.Read
DropDownList1.Items.Add(New ListItem(myreader("akinds"), myreader("id")))
Loop
DropDownList1.Items.Add(New ListItem(("所有类别"), "x"))
DropDownList1.SelectedIndex = DropDownList1.Items.Count - 1
End Sub
‘下拉列表框中的选择项发生变化时候，执行该过程
Private Sub DropDownList1_SelectedIndexChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
If DropDownList1.SelectedValue <> "x" Then
viewstate("sql") = "select id ,title,writer,sdate from articles where akinds=" + DropDownList1.SelectedValue + " order by id desc"
getdata2()
End If
End Sub
‘根据管理员提供的检索信息列出符合条件的文章，然后管理进行
Private Sub Button5_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button5.Click
If TextBox4.Text <> "" Then
If DropDownList2.SelectedValue = "0" Then
viewstate("sql") = "select id ,title,writer,sdate from articles where title like ‘%" + TextBox4.Text + "%‘ order by id desc"
ElseIf DropDownList2.SelectedValue = "0" Then
viewstate("sql") = "select id ,title,writer,sdate from articles where title= ‘" + TextBox4.Text + "‘ order by id desc"
End If
getdata2()
End If
End Sub
End Class
‘ code end
保存编译后，运行效果如图14.7、14.8、14.9所示。
图14.7 管理员登录
图14.8 文章类别管理
图14.9 文章信息管理
14.3.2 Add_Articles.aspx的设计与编码
Add_Articles.aspx的功能是用来向数据库中添加新文章的。前台HTML代码如下：
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="Add_Articles.aspx.vb" Inherits="TheArticleSYS.Add_Articles"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>Add_Articles</title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<center id="CENTER1">
<TABLE id="Table1" cellSpacing="0" cellPadding="0" width="762" border="1" style="BORDER-RIGHT: #009999 1pt solid; BORDER-TOP: #009999 1pt solid; FONT-SIZE: 12pt; BORDER-LEFT: #009999 1pt solid; BORDER-BOTTOM: #009999 1pt solid"
borderColor="#009999">
<TR>
<TD colspan="2" style="BORDER-RIGHT: #009999 1pt solid; BORDER-TOP: #009999 1pt solid; FONT-WEIGHT: bold; FONT-SIZE: 15pt; BORDER-LEFT: #009999 1pt solid; COLOR: #009999; BORDER-BOTTOM: #009999 1pt solid; TEXT-ALIGN: center">文
章 添 加 系 统</TD>
</TR>
<TR>
<TD>文章标题</TD>
<TD>
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator1" runat="server" ErrorMessage="!不能为空!" Font-Size="X-Small"
ControlToValidate="TextBox1"></asp:RequiredFieldValidator></TD>
</TR>
<TR>
<TD>文章类别</TD>
<TD>
<asp:DropDownList id="DropDownList1" runat="server"></asp:DropDownList>
</TD>
</TR>
<TR>
<TD style="WIDTH: 108px">文章作者</TD>
<TD>
<asp:TextBox id="TextBox2" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator2" runat="server" ErrorMessage="!不能为空!" Font-Size="X-Small"
ControlToValidate="TextBox2"></asp:RequiredFieldValidator></TD>
</TR>
<TR>
<TD style="WIDTH: 108px">关键字</TD>
<TD>
<asp:TextBox id="Textbox6" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="Requiredfieldvalidator5" runat="server" ErrorMessage="!不能为空!" Font-Size="X-Small"
ControlToValidate="TextBox6"></asp:RequiredFieldValidator></TD>
</TR>
<TR>
<TD style="WIDTH: 108px">文章出处</TD>
<TD>
<asp:TextBox id="TextBox3" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator id="RequiredFieldValidator3" runat="server" ErrorMessage="!不能为空!" Font-Size="X-Small"
ControlToValidate="TextBox3"></asp:RequiredFieldValidator></TD>
</TR>
<TR>
<TD style="WIDTH: 108px">添加图片</TD>
<TD><INPUT type="file" id="upimg" runat="server"> <FONT face="宋体">图片说明</FONT>
<asp:TextBox id="TextBox5" runat="server"></asp:TextBox>
<asp:Button id="Button1" runat="server" Text="上传图片"></asp:Button></TD>
</TR>
<TR>
<TD style="WIDTH: 108px">文章内容</TD>
<TD>
<asp:TextBox id="TextBox4" runat="server" TextMode="MultiLine" Width="640px" Rows="15"></asp:TextBox>
<br>
<asp:RequiredFieldValidator id="RequiredFieldValidator4" runat="server" ErrorMessage="!不能为空!" Font-Size="X-Small"
ControlToValidate="TextBox4"></asp:RequiredFieldValidator>
</TD>
</TR>
<TR>
<TD style="WIDTH: 108px"></TD>
<TD>
<asp:Button id="Button2" runat="server" Text="添加文章"></asp:Button><FONT face="宋体">
</FONT>
</TD>
</TR>
<TR>
<TD style="WIDTH: 108px"></TD>
<TD><FONT face="宋体"></FONT></TD>
</TR>
<TR>
<TD style="WIDTH: 108px; HEIGHT: 17px"></TD>
<TD style="HEIGHT: 17px"><FONT face="宋体"></FONT></TD>
</TR>
<TR>
<TD style="WIDTH: 108px"></TD>
<TD></TD>
</TR>
</TABLE>
</center>
</form>
</body>
</HTML>
Add_Articles.aspx.vb逻辑代码如下：
Imports System
Imports System.Web
Imports System.Data
Public Class Add_Articles
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 Session("admin") = "" Then
Response.Redirect("Admin_Management.aspx")
End If
If Not Page.IsPostBack Then
‘如果是第一次处理本页面，则从数据库中获取文章分类信息，并添加到下来列表框中。
mysql = "select * from akinds "
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
Dim myreader As OleDb.OleDbDataReader
myreader = mycmd.ExecuteReader
DropDownList1.Items.Clear()
Do While myreader.Read
DropDownList1.Items.Add(New ListItem(myreader("akinds"), myreader("id")))
Loop
myreader.Close()
mycon.Close()
End If
End Sub
‘图片上传功能，如果选择的图片合法，则自动保存到系统服务器中的picfile文件夹中，并把图片路径添加到文章信息中。
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim fn() As String
Dim ft As String
Dim fname As String
If upimg.PostedFile.ContentLength > 0 Then
fn = upimg.PostedFile.FileName.Split("\")
ft = Right(fn(fn.Length - 1), 4)
If ft = ".jpg" Or ft = ".bmp" Or ft = ".gif" Then
fname = Trim(Str(Year(DateTime.Now))) + Trim(Str(DateTime.Now.Month)) + Trim(Str(DateTime.Now.Day)) + Trim(Str(DateTime.Now.Hour)) + Trim(Str(DateTime.Now.Second)) + Trim(Str(DateTime.Now.Millisecond)) + ft
‘调用SaveAs方法，保存图像信息
upimg.PostedFile.SaveAs(Server.MapPath(".") + "\picfile\" + fname)
fname = "<center><img src=picfile/" & fname & " border=0>" & IIf(TextBox5.Text <> "", "<br>" & TextBox5.Text, "")
‘把图片路径信息添加到文章中
TextBox4.Text += Chr(10) & fname & "</center>" & Chr(10)
Else
Response.Write("<secript>alert(‘对不起,图片格式不对,请选择jpg|gif|bmp格式的图片!‘);</script>")
End If
End If
End Sub
‘提交文章信息，
Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click
‘如果页面通过验证
If Page.IsValid Then
Dim content As String
‘替换掉正文中的VB.NET中的换行符号,转化为Html语言中的换行符号,并空两个汉字长度空格
‘首行缩进两个空格
content = " " & Trim(TextBox4.Text.Replace(Chr(10), "<br> "))
mysql = "insert into articles(title,sdate,content,writer,fw,akinds,keyword) "
mysql += "values(‘" + TextBox1.Text + "‘,‘" + DateTime.Now.ToString + "‘,‘" + content + "‘,‘" + TextBox2.Text + "‘,‘" + TextBox3.Text + "‘," + DropDownList1.SelectedValue + ",‘" + Textbox6.Text + "‘)"
mycon.Open()
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
mycmd.ExecuteNonQuery()
Response.Write("<script>alert(‘恭喜你,你已经成功地添加了一篇文章!‘);</script>")
TextBox1.Text = ""
TextBox4.Text = ""
TextBox5.Text = ""
End If
End Sub
End Class
运行结果如图14.10所示。
图14.10 Add_Articles.aspx运行结果
14.3.3 Newlist.aspx与Defalut.aspx的设计与实现
Web用户控件Newlist.aspx要实现的功能是：根据传入的文章类别ID，查找出该类别文章列表中最新的5篇，并显示出来。
Newlist.aspx的前台HTML代码如下：
<%@ Control Language="vb" AutoEventWireup="false" Codebehind="Newlist.ascx.vb" Inherits="TheArticleSYS.newlist" TargetSchema="http://schemas.microsoft.com/intellisense/ie5" %>
<meta name="vs_showGrid" content="True">
<TABLE id="Table1" style="BORDER-RIGHT: ghostwhite 1px solid; BORDER-TOP: ghostwhite 1px solid; BORDER-LEFT: ghostwhite 1px solid; WIDTH: 400px; BORDER-BOTTOM: ghostwhite 1px solid; HEIGHT: 48px"
cellSpacing="1" cellPadding="1" width="450" border="1">
<TR>
<TD align="center"><FONT face="宋体"></FONT></TD>
</TR>
<asp:repeater id="Repeater1" runat="server">
<ItemTemplate>
<TR>
<TD style="FONT-SIZE: 11pt; BORDER-TOP-STYLE: solid; BORDER-BOTTOM: cornsilk 1pt solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; HEIGHT: 19px"
align="left">
<a href=‘<%# "TheArticle.aspx?aid=" & databinder.eval(container.dataitem,"id")%>‘ title=‘<%# "文章标题"& chr(10) & databinder.eval(container.dataitem,"title") %>‘ >
<%# iif(len(databinder.eval(container.dataitem,"title"))>20,left(databinder.eval(container.dataitem,"title"),20) &"...</a>--" ,databinder.eval(container.dataitem,"title") & "</a>--")%>
<font style="FONT-SIZE: 10pt; COLOR: darkgray; FONT-STYLE: italic">[<%# databinder.eval(container.dataitem,"sdate") %>]</font>
</TD>
</TR>
</ItemTemplate>
</asp:repeater>
<TR>
<TD align="center"><FONT face="宋体"></FONT></TD>
</TR>
</TABLE>
Newlist.aspx.vb的逻辑代码如下：
Imports System
Imports System.Web
Imports System.data
Imports System.Configuration.ConfigurationSettings
Public Class newlist
Inherits System.Web.UI.UserControl
#Region " Web 窗体设计器生成的代码 "
‘此处省略了设计器生成的无关代码，以节省篇幅
#End Region
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
‘在此处放置初始化页的用户代码
‘如果传入的参数不为空，则显示出文章信息
If aid <> "" Then
‘ Dim constr As String = "provider=microsoft.jet.oledb.4.0;data source=" & Server.MapPath(".") & "\Articlesys_db.mdb"
‘ Dim mycon As OleDb.OleDbConnection = New OleDb.OleDbConnection(constr)
Dim mysql As String
Dim constr As String = ConfigurationSettings.AppSettings("constr") & Server.MapPath(".") & ConfigurationSettings.AppSettings("dbs")
Dim mycon As OleDb.OleDbConnection = New OleDb.OleDbConnection(constr)
mysql = "select top 5 title,id,sdate from articles where akinds=" + aid + " order by id desc"
Try
Dim mycmd As OleDb.OleDbDataAdapter = New OleDb.OleDbDataAdapter(mysql, mycon)
Dim dt As DataSet = New DataSet
mycmd.Fill(dt)
Repeater1.DataSource = dt.Tables(0)
Repeater1.DataBind()
Catch ex As Exception
Response.Write(ex.Message)
End Try
End If
End Sub
End Class
Default.aspx作为系统的默认主窗体，除了要显示分类文章简要信息外，还要提供文章检索的入口以及管理员入口。其中，分类文章简要信息引用Web用户控件而实现的，在Default.aspx的HTML代码中，我们首先要注册Newlist.ascx。
Default.aspx的HTML代码如下：
<%@ Register TagPrefix="uc1" TagName="newlist" Src="newlist.ascx" %>
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="Default.aspx.vb" Inherits="TheArticleSYS.WebForm1"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title >叮咚文章管理系统欢迎您</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
</HEAD>
<body MS_POSITIONING="GridLayout">
<TABLE height="422" cellSpacing="0" cellPadding="0" width="947" border="0" ms_2d_layout="TRUE">
<TR vAlign="top">
<TD width="10" height="15"></TD>
<TD width="937"></TD>
</TR>
<TR vAlign="top">
<TD height="407"></TD>
<TD>
<CENTER id="CENTER1">
<TABLE id="Table1" cellSpacing="0" cellPadding="0" width="762" border="0">
<tr>
<td colSpan="2"><IMG src="images/bg12.jpg"></td>
</tr>
<TR>
<TD vAlign="top" width="265">
<form id="Form1" runat="server">
<TABLE id="Table2" height="145" cellSpacing="1" cellPadding="1" width="248" border="1">
<TR>
<TD colSpan="2"><IMG src="images/search.jpg"></TD>
</TR>
<TR>
<TD width="57" height="30">类别</TD>
<TD height="30"><asp:dropdownlist id="DropDownList1" runat="server"></asp:dropdownlist></TD>
</TR>
<TR>
<TD width="57">
<P>检索内容</P>
</TD>
<TD><asp:textbox id="TextBox1" runat="server"></asp:textbox><asp:dropdownlist id="DropDownList2" runat="server">
<asp:ListItem Value="title">标题</asp:ListItem>
<asp:ListItem Value="writer">作者</asp:ListItem>
<asp:ListItem Value="keyword">关键字</asp:ListItem>
</asp:dropdownlist></TD>
</TR>
<TR>
<TD width="92" colSpan="2"><asp:button id="Button1" runat="server" Text="检索"></asp:button></TD>
</TR>
</TABLE>
</TD>
<TD><asp:datalist id="DataList1" runat="server" ShowFooter="False" BackColor="White" BorderStyle="Double"
Width="474px" RepeatDirection="Horizontal" RepeatColumns="1" BorderColor="#336666" CellPadding="0"
GridLines="Horizontal" BorderWidth="1px">
<SelectedItemStyle Font-Bold="True" ForeColor="White" BackColor="#339966"></SelectedItemStyle>
<HeaderTemplate>
</HeaderTemplate>
<SeparatorStyle Width="1px"></SeparatorStyle>
<ItemStyle HorizontalAlign="Left" ForeColor="#333333" BackColor="White"></ItemStyle>
<ItemTemplate>
<blockquote style="FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: azure; BACKGROUND-COLOR: #009999">
<%# databinder.eval(container.dataitem,"akinds") %>
<!--分类文章列表入库口 ->
<a href=‘<%# "Articleslist.aspx?moreid="&databinder.eval(container.dataitem,"id")%>‘ target=_blank >
<img src="images/more.gif" border="0"></a> </blockquote><blockquote>
<!--通过Web用户控件实例Newlist1的aid属性的数据库绑定获取aid的值->
<uc1:newlist id="Newlist1" runat="server" aid=‘<%# databinder.eval(container.dataitem,"id") %>‘>
</uc1:newlist>
</blockquote>
</ItemTemplate>
<FooterStyle ForeColor="#333333" BackColor="White"></FooterStyle>
<HeaderStyle Font-Size="Larger" Font-Bold="True" HorizontalAlign="Left" ForeColor="White" VerticalAlign="Middle"
BackColor="#336666"></HeaderStyle>
</asp:datalist></TD>
</TR>
<TR>
<TD width="265"></TD>
<TD></TD>
</TR>
</FORM></TABLE>
</CENTER>
</TD>
</TR>
</TABLE>
</body>
</HTML>
Default.aspx.vb的逻辑代码如下：
Imports System
Imports System.Web
Imports System.data
Public Class WebForm1
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 Page.IsPostBack Then
‘获取文章分类信息
mysql = "select * from akinds "
mycon.Open()
Dim mycmd As OleDb.OleDbDataAdapter = New OleDb.OleDbDataAdapter(mysql, mycon)
Dim dt As DataSet = New DataSet
mycmd.Fill(dt)
DataList1.DataSource = dt.Tables(0)
DataList1.DataBind()
getlist()
End If
End Sub
‘获取文章类别信息，并添加到下拉列表框中
Sub getlist()
Dim mysql As String = "select * from akinds "
Dim mycmd As OleDb.OleDbCommand = New OleDb.OleDbCommand(mysql, mycon)
Dim myreader As OleDb.OleDbDataReader
myreader = mycmd.ExecuteReader
DropDownList1.Items.Clear()
Do While myreader.Read
DropDownList1.Items.Add(New ListItem(myreader("akinds"), myreader("id")))
Loop
myreader.Close()
mycon.Close()
DropDownList1.Items.Add(New ListItem("所有类别", "-1"))
DropDownList1.SelectedValue = "-1"
End Sub
‘文章检索入口，根据用户条件，组合成查询表达式，传入ArticlesList.aspx
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim str As String
str = "akind=" & DropDownList1.SelectedValue
str += "&infor=" & TextBox1.Text
str += "&seekid=" & DropDownList2.SelectedValue
Response.Redirect("ArticlesList.aspx?" & str)
End Sub
End Class
编译后，Delfault.aspx运行结果如图14.11所示：
图14.11 Default.aspx运行结果
