第09章設计新闻管理页.docVIP

设计新闻管理页 本书所指新闻是广义的，凡是以一种题目列表形式出现在主要页面，单击某条后，弹出对应的详细内容的，都可以称为新闻。如新闻报道、通知、产品介绍、通知、博客、杂志等，都可以通过本章介绍的技术实现。 要实现新闻发布，需要设计三种页：新闻管理页（上传新闻）、新闻条目页、新闻详情页。 新闻管理页运行时的效果如图9.1所示。 本章设计结果 准备设计 复制超文本编辑程序 为什么要使用这种程序 很多情况下，新闻内容不是单纯的文字，还混有图片、动画、链接等，录入一个新闻和设计一个不太复杂的静态网页没有多大区别，要实现这么复杂内容的录入，仅依靠文本框控件显然无法实现。因此，本书将使用一个互联网上最流行的、评价最高的、也非常容易使用的、免费的控件，来完成新闻内容的录入工作。这个控件名为fckeditor。 程序构成 本书所用的fckeditor控件版本为2.5.3版，是免费版，今天（2010年4月24）的最新版为2.6.3版，为收费版。如果读者特别希望用上付费最新版，可以通过FCKeditor编辑器官方网址下载得到。网址为：/download。 这个控件由三个文件夹构成，均存放在本书所附光盘的“开发所需文件\fck”文件夹内。它们是： Bin文件夹。这一文件夹内存放着控件的对应程序。 fckeditor文件夹。这一文件夹内存放的是控件的外观文件。 upload文件夹。这一文件夹将用来存放fckeditor编辑新闻时向页面中插入的各种图片、动画及其它各种文件。 复制过程 复制结果如图9.2所示。将这三个文件夹复制到网站内的过程如下： 打开本书配套光盘的“开发所需文件\fck”文件夹。 用鼠标圈定其中的三个文件夹。 右击其中的一个文件夹?复制。 右击“解决方案资源管理器”内的网站名“NewLong”。 在弹出的菜单中选择“粘贴”。 复制后的解决方案资源管理器 添加控件配置语句 仅仅将程序文件复制到网站内还不够，还需要告诉网站这个程序的用法。这是fckeditor软件在发行时特意说明的。 完成这一任务很简单： 双击打开本书配套光盘的“开发所需文件”内的“Web.config中常用语句.txt”。 从打开的文件中复制图9.3中第11~14行内容。 双击打开“解决方案资源管理器”中的Web.Config文件。 删除第11行“appSettings/”。 粘贴为第11~14行。 单击保存按钮“”。 右击图9.3左上侧的文件标签，关闭此文件。 添加设置语句 设计新闻管理页 下载是内容从服务器到浏览器的过程，而上传则方向相反，是内容从浏览器到服务器的过程。所谓上传新闻，就是管理员在网页内编辑新闻，之后保存。新闻就被保存或者说上传到了互联网服务器。 创建新闻管理页 具体创建步骤如下： 单击“解决方案资源管理器”中的网站名“NewLong”。 单击屏幕上方的添加新项按钮“”，屏幕弹出图9.4所示的界面。 添加新网页 在图9.4中，选择“Web窗体”、输入网页名“新闻管理页.aspx”、去掉选定“选择母版页”?“添加”?“确定”。之后，屏幕出现此页设计界面。 在属性窗口，选择“Document”，设置网页标题“title”为“新闻管理”。 由于是管理员在后台管理网站内容，因此，界面应尽量简单，网页可用面积尽量大，因而最好不要用母板页。 添加基本控件 由于每屏只适于录入修改删除一条新闻，因此，最好选用纵向表控件DetailsView，而不使用横向表控件。 具体添加步骤为： 切换到“新闻管理页”设计界面。 从工具箱的“数据”组中，拖出一个到网页已有的Div内。 设置此控件的数据源： 如图9.5所示，单击：选择数据源?新建数据源”。 选择：Access数据库?确定?浏览?找到news.mdb?下一步?选择“新闻表”?选中“*” 单击Where?选择：发布人、=、Session、输入ManagerID、?添加?“确定”。 设置数据源 单击“Order by”?选中“新闻编号”、降序?确定。 单击“高级”?选中“生成Insert…”?确定?下一步?完成。 经过上述设置，实现了某个管理员只能创建、编辑、删除自己录入的新闻。 设置表格控件外观 具体设置步骤为： 设置表格宽度：用鼠标拉宽表格到650px。 设置表头宽度：在属性窗口，设置表格的FieldHeaderStyle的Width属性为80px。 为表格添加功能：单击表格右上角的“”，选中“启用分页”、 “启用编辑”、 “启用插入”、 “启用删除”。 删除不用表列：如图9.6所示，单击表格右上角“”?编辑字段?删除圈定字段。 设置内容高度：如图9.7所示，单击表格右上角的“”?编辑字段?单击选定“新闻内容”?设其ItemStyle/height属性为400px。 设置按钮外观：如