Ajax 댓 글 의 맨 위 와 밟 기 기능 을 실현 하 는 인 스 턴 스 코드

효 과 는 대체로 다음 과 같다.
javascript 은 jquery 를 사용 합 니 다.Asp.net 웹 프로젝트 를 새로 만 들 고 NuGet 을 사용 하여 Jquery 최신 버 전 을 가 져 옵 니 다.

데이터베이스 에 서 는 Nhibenate 를 사용 하고 Install-Package Nhibenate 로 참조 합 니 다.
데이터 베 이 스 는 PostgreSQL,Install-Package Nggsql 로 드라이버 를 설치 합 니 다.게 으 름 피 우 고 데이터베이스 이름,사용자 이름과 비밀 번 호 는 모두 ajax Demo 입 니 다.
데이터베이스 만 들 기:

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 name="connection.driver_class">NHibernate.Driver.NpgsqlDriver</property> 
    <property name="connection.connection_string"> 
      Server=localhost;Database=ajaxDemo;User ID=ajaxDemo;Password=ajaxDemo; 
    </property> 
    <property name="dialect">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 기반 페이지 서비스 인 터 페 이 스 를 사용 하고 클 라 이언 트 에서 자바 스 크 립 트 로 서버 에서 온 응답 을 처리 하 는 것 입 니 다.서버 와 클 라 이언 트 간 의 데이터 교환 데이터 가 대량으로 줄 어 들 었 기 때문에 우 리 는 응답 이 빠 른 응용 을 볼 수 있 습 니 다.또한 많은 처리 작업 이 요청 한 클 라 이언 트 기기 에서 이 루어 질 수 있 기 때문에 웹 서버 의 처리 시간 도 줄 어 들 었 다.
즉,우 리 는 두 부분 이 필요 하 다.
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; 
            } 
        }
        public bool IsReusable 
        { 
            get 
            { 
                return false; 
            } 
        } 
    } 
}

게다가 고객 센터 는 JQuery 를 사용 하기 때문에 생활 이 매우 적다.사용 하 는$.get 방법 입 니 다.
먼저 서버 에 요청 하고 두 개의 인 자 를 입력 하 십시오:state 와 id,서버 데 이 터 를 받 은 후 상 태 를 변경 합 니 다.
주 코드:

function change(id, state) { 
            $.get("./Ajax/ChangeState.ashx", { id: id, state: state }, function (data, textStatus) { 
                if (textStatus == "success") { 
                    switch (state) { 
                        case 0: 
                            $("#Support" + id).text(" （" + data + ") "); 
                            break; 
                        case 1: 
                            $("#Opposition" + id).text(" （" + data + ") "); 
                            break; 
                    } 
                } 
            }); 
        }

페이지 코드:

 
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ViewDetail.aspx.cs" Inherits="AjaxDemo.ViewDetail" %>
<!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">
    <script src=https://www.jb51.net/htynkn/archive/2012/01/31/"Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        function change(id, state) {
            $.get("./Ajax/ChangeState.ashx", { id: id, state: state }, function (data, textStatus) {
                if (textStatus == "success") {
                    switch (state) {
                        case 0:
                            $("#Support" + id).text(" （" + data + ") ");
                            break;
                        case 1:
                            $("#Opposition" + id).text(" （" + data + ") ");
                            break;
                    }
                }
            });
        }
    </script>
</head>
<body>
    <form id="BaseForm" runat="server">
    <div id="infoDetail">
    <h4>  </h4>
    <h1>
        <asp:Label ID="infoContent" runat="server" Text=""></asp:Label></h1>
    </div>

    <div id="reviews">
    <h4>  </h4>
        <asp:Repeater ID="reviewList" runat="server">
        <HeaderTemplate><ul></HeaderTemplate>
        <FooterTemplate></ul></FooterTemplate>
        <ItemTemplate><li><%# DataBinder.Eval(Container.DataItem, "Content") %></li>
        <div>

<a onclick="change(<%# DataBinder.Eval(Container.DataItem, "Id")%>,0)" id="Support<%# DataBinder.Eval(Container.DataItem, "Id")%>" href=https://www.jb51.net/htynkn/archive/2012/01/31/"#"> （<%# DataBinder.Eval(Container.DataItem, "Support") %>）</a>
<a onclick="change(<%# DataBinder.Eval(Container.DataItem, "Id")%>,1)" id="Opposition<%# DataBinder.Eval(Container.DataItem, "Id")%>" href=https://www.jb51.net/htynkn/archive/2012/01/31/"#"> （<%# DataBinder.Eval(Container.DataItem, "Opposition")%>）</a>
</div>
        </ItemTemplate>
        </asp:Repeater>
    </div>
    </form>
</body>
</html>

효과:
 
마지막 에 쓰기:
1.이 글 은 주로 대체적인 방법 을 쓰 는데 완전 하지 도 않 고 전면적 이지 도 않다.많은 잘못 도 처리 하지 않 았 고 세부 사항 도 고려 하지 않 았 다.
2.서버 에서 도 웹 thod 를 사용 할 수 있 습 니 다.특히 기 존 항목 을 수정 할 때 고객 센터 의 자바 script 호출 방법 을 그대로 유지 하면 됩 니 다.나 는 ashx 와 webmethod 가 도대체 어느 것 이 좋 은 지 비교적 의심스럽다.
3.유닛 테스트 그 건 순 전 히 편 의 를 위해 서...뿌리 지 마 세 요.
4.NHiberate 의 설정 템 플 릿...처음에 고민 을 많이 했 는데...
5.관련 라 이브 러 리 와 소프트웨어 버 전:Iesi.collection 3.2.0.4000 Jquery 1.7.1 NHiberate 3.2.0.4000 Nggsql 2.0.11 Nunit 2.5.10.11092