用ASP.NET 2.0设计网络在线投票系统

　　投票页面设计

　　在应用程序WebVote中添加一个新的Web页面，并命名为WebOnlineVote.aspx，它的代码隐藏文件为WebOnlineVote.aspx.cs文件。

　　1．页面设计

　　在页面WebOnlineVote.aspx上添加一个数据网格控件、两个Button控件和一个Label控件，它们的名称分别为VoteList、VoteBtn、ShowVote和VoteMessage。控件VoteList用来显示参与投票的所有项目；控件VoteBtn提交用户的投票；控件ShowVote实现用户查看投票情况；控件VoteMessage显示用户投票的操作结果。页面WebOnlinVote.aspx的设计界面如图6所示。


图6 页面WebOnlinVote.aspx的设计界面

　　页面WebOnlinVote.aspx的HTML设计代码如下：

＜%@ Page Language="C#" AutoEventWireup="true" CodeFile="WebOnlinVote.aspx.cs" Inherits="WebOnlinVote" %＞ ＜HTML＞＜HEAD＞＜title＞网络在线投票系统＜/title＞＜/HEAD＞ ＜asp:datagrid id="VoteList" CssClass="GbText" Runat="server" AutoGenerateColumns="False" DataKeyField="VoteID"＞ ＜Columns＞ ＜asp:TemplateColumn ItemStyle-Width="200"＞ ＜ItemTemplate＞＜%# DataBinder.Eval(Container.DataItem,"Item")%＞ ＜/ItemTemplate＞＜/asp:TemplateColumn＞ ＜asp:TemplateColumn ItemStyle-Width="100"＞ ＜ItemTemplate＞ ＜asp:CheckBox ID="VoteCheck" Runat="server"＞＜/asp:CheckBox＞ ＜/ItemTemplate＞＜/asp:TemplateColumn＞ ＜/Columns＞ ＜FooterStyle BackColor="#FFFFCC" ForeColor="#330099" /＞ ＜SelectedItemStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" /＞ ＜PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" /＞ ＜ItemStyle BackColor="White" ForeColor="#330099" /＞ ＜HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" /＞ ＜/asp:datagrid＞ ＜asp:button id="VoteBtn" Runat="server" Width="100" Text="我要投票"＞＜/asp:button＞      ＜asp:button id="ShowVote" Runat="server" Width="100" Text="查看投票"＞＜/asp:button＞ ＜asp:Label ID="VoteMessage" Runat="server" Visible="False" ForeColor="red" Font-Bold="True"＞投票成功！！！＜/asp:Label＞＜/td＞ ＜/HTML＞

　　1．页面初始化

　　页面WebOnlinVote.aspx调用函数Page_Load(Object sender,EventArgs e)初始化，该函数调用函数BindVoteListData()从数据库投票表Votes中获取所有投票项目的信息，并把获取的数据设置为数据网格控件VoteList的数据源。函数Page_Load(Object sender,EventArgs e)和函数BindVoteListData()的程序代码如下：

private void Page_Load(object sender, System.EventArgs e) { if(!Page.IsPostBack) { //绑定投票的项目 BindVoteListData(); VoteMessage.Visible = false; } } private void BindVoteListData() { //获取所有数据 WebVote.Vote vote = new Vote(); SqlDataReader recv = vote.GetVotes(); //设置控件的数据源，并绑定数据 VoteList.DataSource = recv; VoteList.DataBind(); recv.Close(); //关闭数据读取器 }

　　网络在线投票系统运行之后，投票页面WebOnlinVote.aspx的初始化界面如图7所示，此时显示被投票的项目信息。


图7 投票页面WebOnlinVote.aspx的初始化界面

　　2．投票功能

　　用户单击页面WebOnlinVote.aspx中的【我要投票】按钮和【查看投票】按钮分别触发事件VoteBtn_Click(object sender, System.EventArgs e)和事件ShowVote_Click(object sender, System.EventArgs e)，它们分别实现用户投票功能和查看投票功能。在投票事件中，事件首先检查用户对哪些项目进行了投票，然后更改项目的票数。在查看投票事件中，事件重定向到页面ShowVoteInfo.aspx。事件VoteBtn_Click(object sender, System.EventArgs e)和事件ShowVote_Click(object sender, System.EventArgs e)的程序代码如下：

private void VoteBtn_Click(object sender, System.EventArgs e) { //定义类 WebVote.Vote vote = new Vote(); try { //添加用户的投票的项目 foreach(DataGridItem item in VoteList.Items) { //查找每个投票项目的选择控件 CheckBox check = (CheckBox)item.FindControl("VoteCheck"); if(check != null) { //说明用户已经投票，则需要添加这一票 if(check.Checked == true) { //修改数据库中的票数 vote.UpdateVote(Int32.Parse( VoteList.DataKeys[item.ItemIndex].ToString())); VoteMessage.Visible = true; //显示用户投票操作的结果 } } } //显示操作结果信息 Response.Write("＜script＞window.alert(' 投票成功，感谢您的参与！！！')＜/script＞"); } catch (Exception ex) { //显示修改操作中的失败、错误信息 Response.Redirect("~/DesktopModules/ErrorPage.aspx?ErrorUrl=" + ASPNET2System.RedirectErrorUrl(Request.RawUrl) + "&ErrorMessage=" + ex.Message.Replace("\n", " ")); } } private void ShowVote_Click(object sender, System.EventArgs e) { //导向查看投票结果页面 Response.Redirect("~/ShowVoteInfo.aspx"); }

　　显示投票结果页面设计

　　在应用程序WebVote中添加一个新的Web页面，并命名为ShowVoteInfo.aspx，它的代码隐藏文件为ShowVoteInfo.aspx.cs文件。

　　1．页面设计

　　在页面ShowVoteInfo.aspx上添加一个数据网格控件、一个Label控件和一个Button控件，它们的名称分别为VoteList、VoteMessage、WebOnlineVoteBtn。控件VoteList用来显示参与投票的项目的投票情况，并计算各个投票项目所占的百分比；控件VoteMessage显示用户投票的总票数；控件WebOnlineVoteBtn实现投票页面WebOnlinVote.aspx。页面ShowVoteInfo.aspx的设计界面如图8所示。



图8 页面ShowVoteInfo.aspx的设计界面

　　页面ShowVoteInfo.aspx的HTML设计代码如下：

＜%@ Page Language="C#" AutoEventWireup="true" CodeFile="ShowVoteInfo.aspx.cs" Inherits="ShowVoteInfo" %＞ ＜HTML＞＜HEAD＞＜title＞网络在线投票系统＜/title＞＜/HEAD＞ ＜asp:DataGrid ID="VoteList" Runat="server" CssClass="Normal" AutoGenerateColumns="False" DataKeyField="VoteID"＞ ＜HeaderStyle BackColor="Orange"＞＜/HeaderStyle＞ ＜Columns＞ ＜asp:TemplateColumn HeaderText="投票项目"＞ ＜ItemStyle Width="200px"＞＜/ItemStyle＞ ＜ItemTemplate＞＜%# DataBinder.Eval(Container.DataItem,"Item")%＞ ＜/ItemTemplate＞＜/asp:TemplateColumn＞ ＜asp:TemplateColumn HeaderText="所占总票的百分比"＞ ＜ItemStyle Width="300px"＞＜/ItemStyle＞ ＜ItemTemplate＞ ＜asp:Image ID="voteImage" Runat="server" Height="20" Width='＜%# FormatVoteImage(FormatVoteCount(DataBinder.Eval( Container.DataItem,"VoteCount").ToString()))%＞' mageUrl="Images/vote.gif"＞ ＜/asp:Image＞ ＜%# FormatVoteCount(DataBinder.Eval(Container.DataItem, "VoteCount").ToString())%＞% ＜/ItemTemplate＞＜/asp:TemplateColumn＞ ＜asp:TemplateColumn HeaderText="票数"＞ ＜ItemStyle Width="100px"＞＜/ItemStyle＞ ＜ItemTemplate＞ ＜asp:Label ID="VoteCount" Runat="server"＞ ＜%# DataBinder.Eval(Container.DataItem,"VoteCount")%＞ ＜/asp:Label＞ ＜/ItemTemplate＞＜/asp:TemplateColumn＞ ＜/Columns＞ ＜/asp:DataGrid＞ ＜asp:Label ID="VoteMessage" Runat="server" ForeColor="Red" Width="100%"＞＜/asp:Label＞ ＜asp:button id="WebOnlineVoteBtn" Runat="server" Width="100" Text="返回投票页面" CssClass="ButtonCss" OnClick="WebOnlineVoteBtn_Click"＞＜/asp:button＞ ＜/HTML＞

　　2．页面初始化

　　页面ShowVoteInfo.aspx调用函数Page_Load(Object sender,EventArgs e)初始化。该函数调用函数BindVoteListData()从数据库投票表Votes中获取所有投票的项目，并把获取的数据绑定到数据网格控件VoteList。函数Page_Load(Object sender,EventArgs e)还调用函数SetVoteTotal()从数据库中获取投票的总票数。函数Page_Load(Object sender,EventArgs e)、函数SetVoteTotal()和函数BindVoteListData()的程序代码如下：

int voteTotal = 0; private void Page_Load(object sender, System.EventArgs e) { //设置总票数voteTotal 　SetVoteTotal(); 　if(!Page.IsPostBack) 　{ //显示用户投票的具体情况 　　BindVoteListData(); 　　VoteMessage.Text = "总票数为：" + voteTotal.ToString(); 　} } private void SetVoteTotal() { //获取所有数据 　WebVote.Vote vote = new Vote(); 　SqlDataReader recv = vote.GetVotes(); 　voteTotal = 0; 　//读取每一个参与投票的项目，并计算票数总和 　while(recv.Read()) 　{ //计算它们的总和 　　voteTotal += Int32.Parse(recv["VoteCount"].ToString()); 　} 　recv.Close(); } private void BindVoteListData() { //获取数据 　WebVote.Vote vote = new Vote(); 　SqlDataReader recv = vote.GetVotes(); 　//设置控件的数据源，并绑定控件的数据 　VoteList.DataSource = recv; 　VoteList.DataBind(); 　recv.Close(); }

　　页面ShowVoteInfo.aspx初始化时（即数据网格控件VoteList绑定数据时），分别调用函数FormatVoteCount(String voteCount)和函数FormatVoteImage(int voteCount)来计算每个投票项目所占的百分比和图像的长度（绘制比例图片）。函数FormatVoteCount(String voteCount)和函数FormatVoteImage(int voteCount)的程序代码如下：

public int FormatVoteCount(String voteCount) { //如果投票没有被投票 　if(voteCount.Length ＜= 0) 　{ //返回0个百分比 　　return(0); 　} 　if(voteTotal ＞ 0) 　{ //返回实际的百分比 　　return((Int32.Parse(voteCount)* 100/voteTotal)); 　} 　return(0); } public int FormatVoteImage(int voteCount) { //返回百分比的图像的长度 　return(voteCount * 3); }

　　网络在线投票系统运行之后，显示投票结果页面ShowVoteInfo.aspx的初始化界面如图9所示，此时显示各个项目的投票结果。



图9 某个时候的投票结果页面ShowVoteInfo.aspx

查看本文来源