ASP .net(照片列表详细功能演示）

ASP .net(照片列表详细功能演示）

点击RSS订阅

大家好,今天我们需要讲解的内容就是把上篇文章当中提到的照片列表的很多功能细化去做。

那么之间我们两篇文章的目的就是要让大家深刻体会get，post的使用场景极其作用。像一般处理程序的使用，隐藏域的使用，请求上下文，至于用JQuery，AJAX等的介绍在后面会有，前面两篇文章不做重点讲解。

首先在我们上次写的代码的基础之上实现光棒效果,直接写到模板页里面就行了。用JavaScript写的话代码太多了，所以我们用JQuery来写。

                       

一、需要注意的地方

 

二、隔行变色效果

 

三、比上次好看了吧？

 

四、光棒效果代码

 

五、炫目的光棒效果

下面我们做点击照片的标题的时候，转向大图，还有照片的详细信息。它能点,需要把它变成超链接。点它的时候要转向一个页面，建个一般处理程序来做这件事儿。要让这个页面变得好看一些，需要建个模板。

                       

六、使用同一个模板

 

七、使用占位符

 

八、进行替换

 

九、让标题能点

点击的时候要看照片的详细页面，这个时候知道看哪张照片么？所以就要告诉它。应该把id传过去。把id通过get的方式传过去，在url上传个pid

 

十、传pid

下面我们要做的就是照片的详细页面显示出来内容。在UI层需要底层根据id返回照片对象，底层还没有方法呢？先写底层的方法。

 

十一、根据id返回照片对象dal代码

在bll里面调用，

 

十二、在bll层内调用

底层的代码写完以后，要去编译一下。目的一，保证语法没有错误，二，后面再说。

照片详细页面一般处理程序代码插入位置：

View Code

 1 <%@ WebHandler Language="C#" Class="_02_PhotoDetails" %>
 2 
 3 using System;
 4 using System.Web;
 5 using MyPhotos.Model;
 6 using MyPhotos.BLL;
 7 using System.Text;
 8 
 9 public class _02_PhotoDetails : IHttpHandler {
10     
11     public void ProcessRequest (HttpContext context) {
12         context.Response.ContentType = "text/html";
13         //1.读取模板
14         string path = context.Request.MapPath("templete.htm");
15         string html = System.IO.File.ReadAllText(path);
16         
17         //2.获取pid
18         string s=context.Request.QueryString["pid"];
19         
20         //在url传过来的值，默认情况下是我们给赋的。
21         int pid;
22         if (int.TryParse(s,out pid))
23         {
24             //正确的话，调用底层的代码。
25             //3.读数据库
26             PhotosBLL BLL = new PhotosBLL();
27             Photos p = BLL.GetPhotoByPid(pid);
28             
29             //4.拼表格
30             StringBuilder sb = new StringBuilder();
31             sb.Append("<table id='photoDetails' cellspacing='0px'>");
32             sb.Append("<tr><td>标题</td><td>"+p.PTitle+"</td></tr>");
33             sb.Append("<tr><td>图片</td><td><img src='images/"+p.PUrl+"'width='400px'/></td></tr>");
34             sb.Append("<tr><td>点击次数</td><td>" + p.PClicks + "</td></tr>");
35             sb.Append("<tr><td>支持</td><td>" + p.PUp + "</td></tr>");
36             sb.Append("<tr><td>反对</td><td>" + p.PDown + "</td></tr>");
37             sb.Append("<tr><td>发布时间</td><td>" + p.PTime + "</td></tr>");
38             sb.Append("<tr><td>描述</td><td>" + p.PDes + "</td></tr>");
39             sb.Append("</table>");
40             
41             //5.替换
42             html=html.Replace("@title","照片详细页面").Replace("@table",sb.ToString());
43             
44             //6.输出
45             context.Response.Write(html);
46         }
47         else
48         {
49             context.Response.Write("参数不正确！！！"); 
50         }
51     }
52  
53     public bool IsReusable {
54         get {
55             return false;
56         }
57     }
58 
59 }

十三、报错

 

十四、加个边框

 

十五、照片详细信息演示

这块有个点击次数，支持，反对。点击次数什么时候去加，看的时候就要加上。详细信息页面要放个返回按钮。

写下底层的方法。

 

十六、dal更新点击次数代码

 

十七、执行更新点击次数的SqlHelper代码

 

十八、调用写好的SqlHelper更新点击次数的方法

 

十九、在bll里面调用

写完之后，编译一下。

 

这里我们把刚才写的照片详细页面的步骤写下，帮大家梳理一下思路。

1、照片详细页面

     1、在照片列表页面中 点击照片标题 传pid（url传参）

     2、照片详细页面 读取模板

     3、获取url中的pid

     4、根据pid读照片对象（bll  dal）

     5、拼表格

     6、替换html中的占位符

              7、输出页面

2、更新点击次数

 

二十、更新点击次数并且加个返回列表

 

二十一、手动更改pid