Ajax implements the comment top and step-On Functions

This is a small vacation assignment assigned by the Community. I just proposed my own solution, which is not necessarily the most suitable.

The effect is roughly as follows:

Javascript uses jquery. Create an Asp.net web project and use nuget to obtain the latest jquery version.

The database uses Nhibernate and the install-package Nhibernate reference.

The database uses PostgreSQL. Install-package npgsql to install the driver. I am a lazy here. The database name, username, and password are all ajaxdemo.

Create a database:

 
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 configuration file:

 <?  XML version = "1.0" encoding = "UTF-8"  ?> 

 <  Hibernate-Configuration  Xmlns  = "Urn: nhibernate-configuration-2.2"   >  
 <  Session-factory  >  
 <  Property  Name  = "Connection. driver_class"  > Nhib.pdf. Driver. npgsqldriver </ Property  >  
 <  Property  Name  = "Connection. connection_string"  >  
Server = localhost; database = ajaxdemo; user id = ajaxdemo; Password = ajaxdemo;
 </  Property  >  
 <  Property  Name  = "Dialect" > Nhib.pdf. dialect. postgresqldialect </  Property  >  
 <  Mapping  Assembly  = "Ajaxdemo"  > </  Mapping  >  
 </  Session-factory  >  
 </ Hibernate-Configuration  > 

 

By the way, the nhiberate configuration template is incorrect and the initial catalog is changed to database.

I didn't use the one-to-many nhing of nhiberate (I don't think it is useful). The entity class has two info and review.

  using  system; 
  using  system. collections. generic; 
  using  system. LINQ; 
  using  system. web; 
  using  iesi. collections. generic; 
  namespace  ajaxdemo. modal 
{< br>  Public   class  info 
{< br>  Public   virtual   int  ID { Get ;  set ;}< br>  Public   virtual   string  content { Get ;  set ;}< BR >}

 

 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 ;}
}
}

 

The business layer correspondsCodeIt will not be pasted. The main function is to add and modify features.

Now the preparation is complete. Now we can implement the functions we need.

The biggest feature of AJAX is that it can only send and retrieve necessary data to the server. It uses soap or some other XML or JSON-based page service interfaces, the client uses JavaScript to process responses from the server. Because the data exchange between the server and the client is greatly reduced, we can see that the response is faster. At the same time, a lot of processing work can be done on the client machine that sends the request, so the processing time of the Web server is also reduced.

That is, we need two parts:

1. Client processing, based on jquery

2. General server processingProgram(Ashx), because the returned data is very simple, there is no XML or JSON.

First, let's look at the server. We need to get the top comments or comments of users. So we need to write the ID, top, and top actions together, so we need a parameter to differentiate them.

After obtaining the two parameters, determine whether to step on or top Based on the State, and then update the corresponding entries. The server returns a number representing the current number.

Changestate. ashx:

 Using System;
 Using System. Collections. Generic;
 Using System. LINQ;
 Using System. Web;
Using Ajaxdemo. BLL;
 Using Ajaxdemo. Modal;

 Namespace Ajaxdemo. Ajax
{
 ///   <Summary>   
  ///  Returns the number of updated versions.
  ///   </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 ;
}
}
}
}

 

Besides, because jquery is used, there will be very few active users. The $. Get method used.

First, request the server and input two parameters: State and ID. After receiving the server data, change the status.

Main Code:

 
FunctionChange (ID, state ){
$. Get ("./ajax/changestate. ashx", {ID: ID, state: State },Function(Data, textstatus ){
If(Textstatus = "success "){
Switch(State ){
Case0:
$ ("# Support" + id). Text ("Top (" + Data + ")");
Break;
Case1:
$ ("# Opposition" + id). Text ("step on (" + Data + ")");
Break;
}
}
});
}
 

Page code:

<% @ 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 = " 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 ( "  Top ( " + Data + "  )  " );
 Break ;
 Case   1 :
$ ( "  # Opposition  " + Id). Text ( "  Step on (  " + Data + " )  " );
 Break ;
}
}
});
}
</SCRIPT>
</Head>
<Body>
<Form ID = "  Baseform  " Runat = "  Server  " >
<Div id = "  Infodetail  " >
<H4> title </H4>
<H1>
<Asp: Label id = "  Infocontent  " Runat = "  Server  " TEXT = "" > </ASP: Label> </Div>


<Div id ="  Reviews  " >
<H4> comment </H4>
<Asp: repeater id = "  Reviewlist  " Runat = "  Server  " >
<Headertemplate> <ul> <Footertemplate> </ul> </footertemplate>
<Itemtemplate> <li> <% # databinder. eval (container. dataitem,"  Content  " ) %> </LI>
<Div>

  "  change (<% # databinder. eval (container. dataitem,   " id "  ) %>, 0)  "  id =  "  support <% # databinder. eval (container. dataitem,   " id "  ) %>  "  href =  " # "  top (<% # databinder. eval (container. dataitem,  "  support  " ) %>)  

  "  change (<% # databinder. eval (container. dataitem,   " id "  ) %>, 1)  "  id =  "  opposition <% # databinder. eval (container. dataitem,   " id "  ) %>  "  href =  " # "  step on (<% # databinder. eval (container. dataitem,  "  opposition  " ) %>)  

</Div>
</Itemtemplate>
</ASP: repeater>
</Div>
</Form>
</Body>
</Html>
 

Effect:

 

Attached Demo:

Http://www.ctdisk.com/file/4414932

 

Conclusion:

1. This articleArticleThe main reason is to write a rough idea, which is incomplete and incomplete. Many errors are not handled or detailed.

2. The server can also use webthod. When modifying an existing project, you can directly Save the method to the client's JavaScript call. I am wondering which of the following methods is better for ashx and webmethod.

3. unit testing is purely for convenience... Don't spray

4. The configuration template of nhiberate... I have been struggling for a long time...

5. related libraries and software versions: iesi. Collection 3.2.0.4000 jquery 1.7.1 nhiberate 3.2.0.4000 npgsql 2.0.11 nunit 2.5.10.11092