效果大致如下:
javascript这块使用jquery。新建一个Asp.net web项目,使用NuGet获取Jquery最新版。
数据库方面使用Nhibernate,用Install-Package Nhibernate引用。
数据库是用的PostgreSQL,Install-Package Npgsql把驱动装上。我这里偷个懒,数据库名,用户名和密码都是ajaxDemo了。
创建数据库:
复制代码 代码如下:
CREATE DATABASE "ajaxDemo"
WITH OWNER = "ajaxDemo"
ENCODING = 'UTF8'
TABLESPACE = pg_default
LC_COLLATE = 'Chinese (Simplified)_People''s Republic of China.936'
LC_CTYPE = 'Chinese (Simplified)_People''s Republic of China.936'
CONNECTION LIMIT = -1;
NHiberate配置文件:
复制代码 代码如下:
<?xml version="1.0" encoding="utf-8"?>
<hibernate-configuration xmlns="urn:nhibernate-configuration-2.2" >
<session-factory>
<property>NHibernate.Driver.NpgsqlDriver</property>
<property>
Server=localhost;Database=ajaxDemo;User ID=ajaxDemo;Password=ajaxDemo;
</property>
<property>NHibernate.Dialect.PostgreSQLDialect</property>
<mapping assembly="AjaxDemo"></mapping>
</session-factory>
</hibernate-configuration>
顺带说一句NHiberate的配置模板是错的,改initial catalog为Database。
我没有使用NHiberate的一对多映射(主要是觉得用不上),实体类有两个Info和Review。
复制代码 代码如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Iesi.Collections.Generic;
namespace AjaxDemo.Modal
{
public class Info
{
public virtual int Id { get; set; }
public virtual string Content { get; set; }
}
}
复制代码 代码如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace AjaxDemo.Modal
{
public class Review
{
public virtual int Id { get; set; }
public virtual int InfoId { get; set; }
public virtual string Content { get; set; }
public virtual int Support { get; set; }
public virtual int Opposition { get; set; }
}
}
业务层是对应的代码就不贴了。主要就是添加和修改功能。
准备工作到此基本完成了,现在来实现我们所需要的功能。
Ajax最大的特点是可以仅向服务器发送并取回必需的数据,它使用Soap或其它一些基于XML或Json的页面服务接口,并在客户端采用JavaScript处理来自服务器的响应。因为服务器和客户端之间的数据交换的数据大量减少,结果我们就能看到回应更快的应用。同时很多的处理工作可以在发出请求的客户端机器上完成,所以Web服务器的处理时间也减少了。
也就是我们需要两个部分的东西:
1.客户端的处理,基于JQuery
2.服务器端的处理,我选用的一般处理程序(ashx),因为返回的数据很简单,所以没有xml和json。
先来看服务端,我们需要获取用户顶或踩的是哪条评论,所以需要id,顶和踩的处理我写在一起,所以还需要一个参数来区分。
获取到两个参数以后先根据state判断是踩还是顶,然后更新相应条目,服务端返回一个代表当前对应数目的数字。
ChangeState.ashx:
复制代码 代码如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using AjaxDemo.BLL;
using AjaxDemo.Modal;
namespace AjaxDemo.Ajax
{
/// <summary>
/// 返回更新以后的数目
/// </summary>
public class ChangeState : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
int state = int.Parse(context.Request.QueryString["state"]);
int id=int.Parse(context.Request.QueryString["id"]);
ReviewService rs = new ReviewService();
Review r;
switch (state)
{
case 0:
r=rs.UpdateSupport(id);
context.Response.Write(r.Support);
break;
case 1:
r = rs.UpdateOpposition(id);
context.Response.Write(r.Opposition);
break;
}
}