第10章 发布新闻.docx

第10章 发布新闻.docx

《第10章 发布新闻.docx》由会员分享，可在线阅读，更多相关《第10章 发布新闻.docx（14页珍藏版）》请在冰豆网上搜索。

第10章发布新闻

第10章发布新闻

新闻上传后，下一步设计任务就是如何让浏览者看到新闻条目页、并实现单击某条目后，看到新闻详情。

这就是所谓的“发布新闻”。

10.1创建新闻条目页

创建步骤如下：

（1）打开网站，进入设计状态。

（2）单击“解决方案资源管理器”中的网站名“NewLong”。

（3）单击屏幕上方的添加新项按钮“

”，屏幕弹出图10.1所示的界面。

图10.1添加新网页

（4）在图10.1中，输入网页名“新闻条目页.aspx”、选定“选择母版页”“添加”“确定”。

之后，屏幕出现此页设计界面。

（5）向ContentPlaceHoder1中，拖入一个div。

（6）设置此层属性，具体见表10.1。

表10.1层属性设置表

Id

定位

背景

块

position

width

height

Backgroundcolor

text-align

divMain

Absolute

650

400

白色

center

10.2设计显示新闻条目页

本书用一个网页来显示某类新闻条目，设计效果如图10.2所示。

图10.2新闻条目页设计效果

10.2.1添加显示控件

在divMain中按回车空出一行。

从工具箱的“数据”组中，拖出一个

到网页内的divMain内。

10.2.2设置此控件的数据源

（1）如图10.3所示，单击：

选择数据源新建数据源”。

（2）选择：

Access数据库确定浏览找到news.mdb下一步选择“新闻表”只选中图中“新闻编号”、“新闻标题”、“发布时间”、“点击次数”四项。

图10.3设置数据源的表项

（3）单击Where，如图10.4所示，选择：

新闻类别、=、QueryString、输入：

类别、添加“确定”。

这一步设置的原因是：

当网页运行时，单击图10.4左侧菜单“新闻与焦点”时，会跳转到“新闻条目页.aspx?

类别=新闻”（参见4.3.2节）。

即跳转到本页，并给本页一个QueryString类型的变量“类别”，其值为“新闻”。

本页数据源会根据这一变量的值，筛选出符合条件的数据。

并供给表格，于是，本页表内就会只显示出类别为“新闻”的数据。

如果单击图10.4左侧菜单“售后服务”时，会跳转到“新闻条目页.aspx?

类别=售后服务”，同样，本页表中，只会显示出类别为“售后服务”的数据。

（4）单击Orderby（即排序依据），如图10.5所示：

选择：

发布时间、降序“确定”下一步完成。

图10.4设置数据筛选条件

图10.5设置数据排序依据

10.2.3设置表格总体外观

具体设置步骤为：

（1）设置表格宽度：

用鼠标拉大表格宽度到500px。

（2）设置表内内容左对齐：

在属性窗口，设置表格的RowStyle\HorizontalAlign：

Left。

（3）设置表头不显示：

在属性窗口，设置表格的ShowHeader：

False。

（4）设置表格颜色：

单击表格右上角的“

”单击弹出菜单中的第一项“自动套用格式”选择“专业型”确定。

（5）设置表格页码：

单击表格右上角的“

”单击选中弹出菜单中“启用分页”。

在属性窗口，设PageSize：

11。

（6）去掉无需显示列：

如图10.3所示，单击表格右上角的“

”单击“编辑列”，弹出图10.6所示的界面分别单击选定界面左下侧的“新闻编号”、“点击次数”单击按钮“

”。

图10.6表列设置界面

10.2.4设置表列外观

（1）设置新闻标题列

如图10.6所示：

Ø选定界面左下侧的“新闻标题”。

Ø在界面右侧，设ItemStyle/Width：

400px

Ø单击“将此字段转换为TemplateField”。

（2）设置发布时间列

如图10.7所示：

Ø选定界面左下侧的“发布时间”

Ø在界面右侧，设DataFormatString：

{0:

yyyy-MM-dd}。

注意：

M为大写，表示月份（Month），如果M小写，则表示分钟（minute）设其HtmlEncode属性为False（这样日期格式才有效）。

图10.7设置时间格式

10.2.5更换标题显示控件

浏览者的习惯是：

点击新闻标题，跳转到相应的新闻详情页。

要实现这一目的，需要通过编辑模板实现。

具体设计步骤如下：

（1）单击表格右上角的“

”单击弹出菜单中的“编辑模板”。

因为只有“新闻标题”一个模板字段，所以，屏幕展示出此字段的模板（见图10.8）。

图10.8新闻标题模板

（2）删除模板中的标签。

这个标签就是原来用于显示新闻标题的控件。

（3）从工具箱的“标准”组内，拖入一个超链接控件（HyperLink）到原标签处。

（4）单击“编辑DataBindings”。

弹出图10.9所示界面。

（5）选中“显示所有属性”

（6）单击界面左侧Text

（7）在界面右侧，选定“新闻标题”，这样，超链接上显示的文字即会是新闻标题。

10.2.6设置跳转到新闻详情页

单击图10.9设置界面左侧上方的NavigateUrl（跳转到网址）在界面右侧，选定“自定义绑定”输入：

"新闻详情页.aspx?

ID="+Eval（"新闻编号"）

输入时一定要注意，全部为英文标点，否则，浏览者单击新闻标题时，无法跳转到新闻详情页，并显示相应新闻详情。

Eval的功能是从数据库中取出某项值。

10.2.7设置点击次数提示

具体设计步骤为：

单击图10.9所示设置界面左侧下方的ToolTip在界面右侧，选定“自定义绑定”输入：

"点击次数：

"+Eval（"点击次数"）

这样，浏览者鼠标指向标题时，就会鼠标指针处，显示此条新闻的“点击次数：

xx”。

这里的xx为点击次数。

图10.9设置字段对应表项

10.2.8在新窗口显示新闻详情

很多浏览者喜欢在点击新闻后，另出现一个窗口，在新窗口中浏览新闻，而新闻条目页还存在。

实现这一要求的步骤如下：

（1）单击“确定”按钮，结束图10.9的设置工作。

（2）在属性窗口，设置超链接控件的Target：

_Blank。

10.3设计显示新闻详情页

本书示例将用一个网页显示某个新闻的详情。

10.3.1创建新闻详情页

创建步骤如下：

（1）关闭“新闻条目页.aspx”。

（2）单击“解决方案资源管理器”中的网站名“NewLong”。

（3）单击屏幕上方的添加新项按钮“

”，在弹出界面中输入网页名“新闻详情页.aspx”、选定“选择母版页”“添加”“确定”。

之后，屏幕出现此页设计界面。

（4）向ContentPlaceHoder1中，拖入一个div。

（5）设置此层属性，具体见表10.2。

表10.2层属性设置表

Id

定位

背景

块

position

width

height

Backgroundcolor

text-align

divMain

Absolute

650

400

白色

center

本网页最终设计效果如图10.10所示。

图10.10新闻条目页运行效果

10.3.2添加显示控件

在divMain中按回车空出一行。

从工具箱的“数据”组中，拖出一个

控件到网页内的divMain内。

（注意，这是本书第一次使用本控件）

10.3.3设置此控件的数据源

（1）单击

控件右上角的按钮“

”，单击弹出菜单的：

选择数据源新建数据源”。

（2）选择：

Access数据库确定浏览找到news.mdb下一步选择“新闻表”选中“*”。

（3）单击Where选择：

新闻编号、=、QueryString、输入：

ID、添加“确定”。

（4）单击“高级”，选中“生成Insert…”“确定”下一步完成。

操作结果如图10.11所示。

图10.11添加控件效果

10.3.4设置表格外观

具体设置步骤为：

（1）设置表格宽度：

在属性窗口，设置表格属性Width：

90%。

（2）单击表格右上角的“

”单击弹出菜单中的“编辑模板”

（3）从工具箱中，拖入三个div到模板内第一个字前（不需要设每个层的属性，其位置一也不是绝对定位，而是普通位置，即相当于网页内众多文字中的一个文字）。

（4）如图10.12所示，将有关文字和控件分别拖至三个Div内，余下的文字和控件删除。

（5）设新闻标题所在div居中对齐、新闻内容所在div左对齐，新闻出处所在div右对齐。

图10.12将部分原有文字和控件放入层

10.3.5设置表内数据外观

（1）单击选定“［新闻标题］”设其字号：

x-large（24pt）、红色。

（2）圈定出处层的所有内容，设其字号：

small（12pt）。

（3）选定内容层。

在属性窗口，设置内容层的层属性：

ØStyle/定位/height:

200px。

ØStyle/布局/Overflow：

auto（即如果内容多于层大小，则自动出现滚动条）。

10.3.6处理点击次数

浏览者每点击一次，数据库中的点击次数就应累加一次。

为此，需要如下设置。

（1）修改数据源

选中表下方的AccessDataSource1单击属性窗口中的UpdateQuery，弹出图10.13所示界面。

在此界面中：

1修改上部语句为：

UPDATE[新闻表]SET[点击次数]=[点击次数]+1WHERE[新闻编号]=?

在修改语句时，一定要使用英文标点，注意词间空格。

2删除界面左下角所有项。

3单击界面中部的“刷新参数”按钮，界面左下侧会出现一个“？

”（见图10.14）。

4设置“？

”的参数源为QueryString、ID。

设置结果如图10.14所示。

图10.13数据表更新语句

图10.14修改后的数据表更新语句

（2）输入命令

双击“解决方案资源管理器”中的“新闻详情页.aspx.cs”，打开程序录入窗口，输入图10.15所示的16～27行程序。

图10.15数据表更新命令

程序解释：

第17行：

如果表格的条目数为0，则返回，即不再执行下面的语句。

第18行：

这一行较长，需要从中间开始阅读和理解：

在DataList1的第0条数据中查找控件，其名为“新闻标题Label”，这个控件是一个标签，将标签中的文字设为网页标题。

第20～27行：

尝试让数据源执行更新数据（即执行［点击次数］=［点击次数］+1），如果有异常，则抓住异常，并将异常信息写到网页内。

10.3.7理解控件

切换到新闻详情页的设计界面，结束模板编辑，会发现表格控件变成如图10.16所示难看样式。

这是正确的，因为它是在示意表格中有多条数据，每条数据由于很长，所以表格显得很长。

对于本章而言，浏览者每次打开本页，只有一条对应新闻可显示，因此，也就永远不会出现图中10.16所示混乱场面。

图10.16结束模板编辑后设计效果