显示投票结果页面设计
在应用程序WebVote中添加一个新的Web页面,并命名为ShowVoteInfo.aspx,它的代码隐藏文件为ShowVoteInfo.aspx.cs文件。
1.页面设计
在页面ShowVoteInfo.aspx上添加一个数据网格控件、一个Label控件和一个Button控件,它们的名称分别为VoteList、VoteMessage、WebOnlineVoteBtn。控件VoteList用来显示参与投票的项目的投票情况,并计算各个投票项目所占的百分比;控件VoteMessage显示用户投票的总票数;控件WebOnlineVoteBtn实现投票页面WebOnlinVote.aspx。页面ShowVoteInfo.aspx的设计界自行设计。代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ShowVoteInfo.aspx.cs" Inherits="ShowVoteInfo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>网络在线投票系统</title>
</head>
<body bgcolor="#ffffcc">
<form id="form1" runat="server">
<asp:DataGrid ID="VoteList" runat="server" AutoGenerateColumns="False" DataKeyField="VoteID" Height="160px" Width="744px">
<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())) %>'
ImageUrl="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>
<br />
<asp:Label ID="VoteMessage" runat="server" Text="Label" Width="100%"></asp:Label><br />
<asp:Button ID="WebOnlineBtn"
runat="server" Text="返回投票页面" Width="100px" PostBackUrl="WebOnlinVote.aspx"></asp:Button >
</form>
</body>
</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()的程序代码页面ShowVoteInfo.aspx初始化时(即数据网格控件VoteList绑定数据时),分别调用函数FormatVoteCount(String voteCount)和函数FormatVoteImage(int voteCount)来计算每个投票项目所占的百分比和图像的长度(绘制比例图片)。函数FormatVoteCount(String voteCount)和函数FormatVoteImage(int voteCount)的程序代码如下:
int voteTotal = 0;
protected void Page_Load(object sender, EventArgs e)
{
SetVoteToal();
if (!Page.IsPostBack)
{
BindVoteListData();
VoteMessage.Text = "总票数为:" + voteTotal.ToString();
}
}
private void SetVoteToal()
{
Vote vote = new Vote();
SqlDataReader recv = vote.GetVotes();
voteTotal = 0;
while (recv.Read())
{
voteTotal +=Int32.Parse(recv["VoteCount"].ToString());
}
recv.Close();
}
private void BindVoteListData()
{
Vote vote = new Vote();
SqlDataReader recv = vote.GetVotes();
VoteList.DataKeyField = "VoteID";
VoteList.DataSource = recv;
VoteList.DataBind();
recv.Close();
}
public int FormatVoteCount(String voteCount)
{
if (voteCount.Length<= 0)
{
return (0);
}
if (voteTotal > 0)
{
return ((Int32.Parse(voteCount)*100/voteTotal));
}
return (0);
}
public int FormatVoteImage(int voteCount)
{
return (voteCount * 3);
}
运行后的界面
请在下面输入新投票项目的名称:
画面不怎么好看,看来得加时间补CSS了...
<script type="text/javascript"> </script> <script src="/WebVote/WebResource.axd?d=V_QkXQXUit9Aq8_rayhQgA2&t=633339380593125000" type="text/javascript"></script>
投票项目 | 所占总票的百分比 | 票数 |
RUP快速开发教程 | 30% | 6 |
DELPHI | 25% | 5 |
VC++深入教程 | 15% | 3 |
VC#深入教程 | 20% | 4 |
ASP.NET2.0高手教程 | 10% | 2 |
总票数为:20