Jquery + ajax + C # simple example for database data operations without refreshing _ jquery

This article mainly introduces a simple example of jquery + ajax + C # To operate database data without refreshing data. For more information, see, we hope this will help you understand the differences between synchronous execution and asynchronous execution. In order to better improve the user experience, we will adopt asynchronous methods to solve some problems, after all, single-threaded synchronization may cause freezing and other phenomena, which is unfriendly. Therefore, ajax can be used to complete user experience, now let's talk about how to use jquery ajax to implement refreshing content.

We only obtain the content unilaterally, but do not consider paging. We will talk about refreshing pagination later.

A Div container is placed on the page to store the returned content.

Note: wait.gif is an effect similar to the progress bar. This effect is displayed when no content is loaded and not loaded. This improves the user experience. Then the most important thing is jquery, which requires ajax.

Code:

The Code is as follows:

Function getInfo ()
{
$. Ajax ({
Url: "doAction. aspx? Fig = reader & id = 1 & page = 1 ",
Type: "POST ",
Success: function (Data)
{
$ ("# Comment" pai.html (Data );
// You can use arguments [0] to receive $ ("# comment" cmd.html (arguments [0]);
},
Error: function ()
{
Alert ("program error ");
}
})
}

Url: url

Type: submission method. It can be POST or GET.

Success: The function executed after successful communication

Error: function executed after communication failure

BeforeSend: Han Shuo, which is executed before communication

Complete: The function executed after communication is complete.

The POST submission method is adopted here, which is more secure than Get, so it can be replaced with the following method.

The Code is as follows:

Function getInfo1 (){
$. Post ("doAction. aspx", {fig: "reader", id: "1", page: "1"}, function (){
$ ("# Comment" cmd.html (arguments [0]);
})
}

We can see that the parameters are written differently and adopt the POST submission method. The first and second methods differ in the following ways:

First, when receiving parameters. the first method in the aspx page is Request. queryString ["fig"] receives the Request. The second method is Request. form ["fig"]

Second, when the communication fails, the first method can return error messages in a friendly way. The second method is not found and can return

Then, on the doAction. aspx page, you only need to perform corresponding processing.

The Code is as follows:

If (Request. Form ["fig"]! = Null & Request. Form ["fig"]. ToString () = "reader ")
{
Ajax_getcomment ("1", 1 );
}
// Obtain data from the database
Private void ajax_getcomment (string id, int page)
{

Using (CommentBO cm = new CommentBO (id, page-1 ))
{
Response. Write (cm. getCommentContent ());
}
}

Similarly, if you only use the Get submission method, use $. get ("", {}, function ..

The load () method can be used to load the content. For details about the usage, refer to the api and briefly describe how to load the content using load.

Code

The Code is as follows: