Web端编写（五）——会议文件的列表

来源：互联网发布：淘宝api调用实例php 编辑：程序博客网时间：2024/06/06 15:50

到了这一步，就很简单了，因为很多东西都讲过了。老规矩，效果图上来。

可恶的腾讯，可恶的华为，华为没有硬件截屏，软件截屏对全屏应用截不完，为了截屏装个腾讯管家，又偷偷装应用宝。

继续，上页面html代码。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MeetingFile.aspx.cs" Inherits="MeetingSys.MeetingFile" %><%@ Register TagName="WapTitle" TagPrefix="UC_Title" Src="AppUC/Title.ascx" %><%@ Register TagName="CopyRight" TagPrefix="UC_CopyRight" Src="AppUC/CopyRight.ascx" %><!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">    <meta http-equiv="pragma" content="no-cache">    <meta http-equiv="cache-Control" content="no-cache">    <meta http-equiv="expires" content="0">    <meta name="viewport" content="user-scalable=yes, width=device-width"/>    <title></title>    <link rel="stylesheet" type="text/css" href="..\Styles\WapStyle.css"/>    <script type="text/javascript" src="..\Scripts\MeetingSys.js"></script></head><body>    <form id="form1" runat="server">    <div>    <UC_Title:WapTitle ID="TopTitle" runat="server" />    <div id="PopMenu">    <p onclick="javascript :history.back(-1)">查看会议议程</p>        <hr style="border:0;background-color:#777777;height:1px;margin: 0;padding:0;"/>    <p onclick="PopContact();">联系我们</p><p onclick="PopAbout();">关于系统</p></div>    <div id="FileList">    <ul>        <asp:Repeater ID="FileRP" runat="server">                <ItemTemplate>                <li onclick="ViewFile('<%#Eval("ID").ToString().Trim()%>')"><%#Eval("mTitle").ToString().Trim()%></li>                </ItemTemplate>        </asp:Repeater>      </ul>      </div>    <UC_CopyRight:CopyRight ID="CopyRightUC" runat="server" />    </div>    </form></body></html>

是不感觉就像会议列表的简化版？其实就是同一回事，只不过这里更简单，菜单那里多了个返回上一页面的JS函数，连函数都懒得写了，直接在onclick里面就搞定了；文件列表和会议列表有点不一样，Repeater控件放在ul里面了，重复的是li了。接下来玩的就是CSS，绑数据和li的onclick事件了。

FileList层的样式

#FileList{    position:absolute;    width:96%;       left:2%;    right:2%;    top:3em;     }#FileList ul{    margin:0;    display:block;    list-style:none;        padding:0px;    width:100%;    }#FileList ul li{    border-left: 1px solid #999;    border-right: 1px solid #999;    border-bottom: 1px solid #999;    font-size:1em;    text-align:left;    text-indent:1em;    height:3em;    line-height:3em;    background:#EEEEEE;    }#FileList ul li:first-child{    border-top-left-radius:5px;    border-top-right-radius:5px;    border-top:1px solid #999;    }#FileList ul li:last-child{    border-bottom-left-radius:5px;    border-bottom-right-radius:5px;    }

first-child和last-child看字面就知道啦，分别是第一条记录和最后一条记录，这个样式纯粹是为了好看，弄4个圆角的框感觉比较高大上，哈哈。

绑定数据

        protected void Page_Load(object sender, EventArgs e)        {            string mID=Request.QueryString["ID"];            DataTable DT = MeetingOP.DataOP.GetDataTable("Select * from MeetingFile where mMeetingID="+mID);            if (DT.Rows.Count > 0)            {                FileRP.DataSource = DT;                FileRP.DataBind();                TopTitle.sTitle = "请选择需要查看的会议文件";            }            else            {                TopTitle.sTitle = "这个会议管理员没有上传会议文件";            }        }

没有什么新鲜玩意，不说了

ViewFile()的JS函数

//查看指定ID的会议文件，仅支持PDF文件function ViewFile(FileID) {    window.location = "ViewFile.aspx?ID=" + FileID;}

也是个跳转函数，例牌菜了，下篇讲讲怎么打开PDF文件，这是最终的大菜，压轴的，讲完这个系列博文就结束了。

0 0