. Net uses Ajax technology to achieve no-refreshing paging (beginner)

Source: Internet
Author: User
In. net, there are many solutions to achieve no refreshing paging. The example I wrote mainly uses the Ajax principle to implement a non-refreshing paging (in fact, I don't think this solution fully uses Ajax technology ).
Here we will use stored procedures to implement data paging, Code As follows:

---- Hu Yaohua 2007.4.4
Set ansi_nulls on
Set quoted_identifier on
Go

 

Alter procedure [DBO]. [pagecut]
@ Strgetfields varchar (1000) = '*', -- the column to be returned
@ Fldname varchar (255) = '', -- Name of the sorted Field
@ Pagesize Int = 10, -- page size
@ Pageindex Int = 1, -- page number
@ Strwhere varchar (1500) = '', -- Query condition (Note: Do not add where)
@ Counts int out -- total number of records returned. If the value is not 0, the total number of records returned after running is returned.
As
Set nocount on
Declare @ strsql varchar (5000) -- subject sentence
Declare @ countsql nvarchar (4000)
Declare @ strtmp varchar (110) -- Temporary Variable
Declare @ strorder varchar (400) -- sort type

If @ pageindex = 1
Begin
If @ strwhere! =''
Set @ strsql = 'select top '+ STR (@ pagesize) + @ strgetfields + 'from testtable where' + @ strwhere + ''+ 'order by ['+ @ fldname +'] DESC'

Else
Set @ strsql = 'select top '+ STR (@ pagesize) + @ strgetfields + 'from testtable' + 'order by [' + @ fldname + '] DESC'
-- Execute the above Code on the first page, which will speed up the execution.
End

Else
Begin
-- The following code gives @ strsql the SQL code to be actually executed
-- Set @ strtmp = '<(select min'
Set @ strsql = 'select top '+ STR (@ pagesize) + @ strgetfields + 'from testtable where [' + @ fldname + ']' + '<(select min' +' (['+ @ fldname +']) from (select top '+ STR (@ PageIndex-1) * @ pagesize) + '[' + @ fldname + '] From testtable' + 'order by [' + @ fldname + '] desc' +') as tbltmp) '+ 'order by [' + @ fldname + '] desc'
If @ strwhere! =''
Set @ strsql = 'select top '+ STR (@ pagesize) + ''+ @ strgetfields + 'from testtable where [' + @ fldname + ']' + '<(select min' +' (['+ @ fldname +']) from (select top '+ STR (@ PageIndex-1) * @ pagesize) + '[' + @ fldname + '] From testtable where' + @ strwhere + 'order by ['+ @ fldname +'] DESC '+') as tbltmp) and '+ @ strwhere + ''+ 'order by [' + @ fldname + '] DESC'

End

If @ strwhere! =''
Set @ countsql = 'select @ counts = count (*) from testtable where '+ @ strwhere +''
Else
Set @ countsql = 'select @ counts = count (*) from testtable'

Exec sp_executesql @ countsql, n' @ counts int out', @ counts out
Exec (@ strsql)
Set nocount off

 

This is a copy of the general stored procedures I have collected on the Internet. It is very efficient and suitable for paging of millions of data.
Next step. We first set up a web project to create a database connection class dB. cs. The Code is as follows:

Using system;
Using system. Data;
Using system. configuration;
Using system. Web;
Using system. Web. Security;
Using system. Web. UI;
Using system. Web. UI. webcontrols;
Using system. Web. UI. webcontrols. webparts;
Using system. Web. UI. htmlcontrols;
Using system. Data. sqlclient;

/// <Summary>
/// Summary of the database
/// </Summary>
Public class DB
{
Public dB ()
{
//
// Todo: add the constructor logic here
//
}
// Public sqlconnection conn ()
//{

// Sqlconnection conn = new sqlconnection (configurationmanager. connectionstrings ["personal"]. connectionstring); // connect to the database
// Return conn;
//}

// return dataset
Public static dataset sta ()
{< br> dataset DS = new dataset ();
sqlconnection conn = new sqlconnection (configurationmanager. connectionstrings ["personal"]. connectionstring); // connect to the database
Conn. open ();
// sqlcommand COM = new sqlcommand ("pagecut", Conn); COM. commandtype = commandtype. storedprocedure;
sqldataadapter mycommand = new sqldataadapter ("pagecut", Conn);
// sqldatareader DBR = cmd. executereader (commandbehavior. closeconnection);
mycommand. selectcommand. commandtype = commandtype. storedprocedure;

Sqlparameter strgetfields = new sqlparameter ("@ strgetfields", sqldbtype. varchar );
Strgetfields. = "*"; // Field
Mycommand. selectcommand. Parameters. Add (strgetfields );

Sqlparameter fldname = new sqlparameter ("@ fldname", sqldbtype. varchar );
Fldname. = "ID"; // sorting Field
Mycommand. selectcommand. Parameters. Add (fldname );

Sqlparameter pagesize = new sqlparameter ("@ pagesize", sqldbtype. INT );
Pagesize. = 10; // page size
Mycommand. selectcommand. Parameters. Add (pagesize );

Sqlparameter pageindex = new sqlparameter ("@ pageindex", sqldbtype. INT );
Pageindex. = 1; // current page
Mycommand. selectcommand. Parameters. Add (pageindex );

Sqlparameter strwhere = new sqlparameter ("@ strwhere", sqldbtype. varchar );
Strwhere. = ""; // Condition
Mycommand. selectcommand. Parameters. Add (strwhere );

Sqlparameter counts = new sqlparameter ("@ counts", sqldbtype. INT );
Counts. = 1; // The total number of records
Counts. Direction = parameterdirection. output; // set this parameter to return the calculated result.
Mycommand. selectcommand. Parameters. Add (counts );
Mycommand. Fill (DS );
Return Ds;

}< br> Public static sqldataadapter DT (INT pagesize)
{< br> sqlconnection conn = new sqlconnection (configurationmanager. connectionstrings ["personal"]. connectionstring); // connect to the database
Conn. open ();
// sqlcommand COM = new sqlcommand ("pagecut", Conn); COM. commandtype = commandtype. storedprocedure;
sqldataadapter mycommand = new sqldataadapter ("pagecut", Conn);
// sqldatareader DBR = cmd. executereader (commandbehavior. closeconnection);
mycommand. selectcommand. commandtype = commandtype. storedprocedure;

Sqlparameter strgetfields = new sqlparameter ("@ strgetfields", sqldbtype. varchar );
Strgetfields. = "*"; // Field
Mycommand. selectcommand. Parameters. Add (strgetfields );

Sqlparameter fldname = new sqlparameter ("@ fldname", sqldbtype. varchar );
Fldname. = "ID"; // sorting Field
Mycommand. selectcommand. Parameters. Add (fldname );

Sqlparameter pagesize = new sqlparameter ("@ pagesize", sqldbtype. INT );
Pagesize. = 10; // page size
Mycommand. selectcommand. Parameters. Add (pagesize );

Sqlparameter pageindex = new sqlparameter ("@ pageindex", sqldbtype. INT );
Pageindex. = pagesize; // current page
Mycommand. selectcommand. Parameters. Add (pageindex );

Sqlparameter strwhere = new sqlparameter ("@ strwhere", sqldbtype. varchar );
Strwhere. = ""; // Condition
Mycommand. selectcommand. Parameters. Add (strwhere );

Sqlparameter counts = new sqlparameter ("@ counts", sqldbtype. INT );
Counts. = 1; // The total number of records
Counts. Direction = parameterdirection. output; // set this parameter to return the calculated result.
Mycommand. selectcommand. Parameters. Add (counts );
Conn. Close ();
Return mycommand;

}

Public static sqldatareader SDR (INT pagesize)
{< br> sqlconnection conn = new sqlconnection (configurationmanager. connectionstrings ["personal"]. connectionstring); // connect to the database
Conn. open ();
sqlcommand COM = new sqlcommand ("pagecut", Conn);
COM. commandtype = commandtype. storedprocedure;
sqlparameter strgetfields = new sqlparameter ("@ strgetfields", sqldbtype. varchar);
strgetfields. = "*"; // field
COM. parameters. add (strgetfields);

Sqlparameter fldname = new sqlparameter ("@ fldname", sqldbtype. varchar );
Fldname. = "ID"; // sorting Field
Com. Parameters. Add (fldname );

Sqlparameter pagesize = new sqlparameter ("@ pagesize", sqldbtype. INT );
Pagesize. = 10; // page size
Com. Parameters. Add (pagesize );

Sqlparameter pageindex = new sqlparameter ("@ pageindex", sqldbtype. INT );
Pageindex. = pagesize; // current page
Com. Parameters. Add (pageindex );

Sqlparameter strwhere = new sqlparameter ("@ strwhere", sqldbtype. varchar );
Strwhere. = ""; // Condition
Com. Parameters. Add (strwhere );

Sqlparameter counts = new sqlparameter ("@ counts", sqldbtype. INT );
Counts. = 1; // The total number of records
Counts. Direction = parameterdirection. output; // set this parameter to return the calculated result.
Com. Parameters. Add (counts );
Sqldatareader SDR = com. executereader ();
Return SDR;

}

Public static sqldatareader SDR ()
{
Throw new exception ("the method or operation is not implemented .");
}
}

Create a. ASPX page (default. aspx) to call the DB. CS class:

Public partial class _ default: system. web. UI. page
{< br> dB DB = new dB ();
Public String QQ;
Public int pageze = 1;
Public int temp;
protected void page_load (Object sender, eventargs e)
{< br>
If (! Ispostback)
{< br> getveiw (1);
next ();

}< br>

}
// Public override void verifyrenderinginserverform (Control)
//{

// Confirms that an htmlform control is rendered

//}
Public void next ()
{

If (request. querystring ["Next"] = "Next ")
{
Temp = convert. toint32 (request. querystring ["name"]);
Getveiw (temp );

}

}

Public void getveiw (INT pagesize)
{
Sqldataadapter sta = dB. dt (pagesize );
Dataset DS = new dataset ();
Sta. Fill (DS );
Gridview1.datasource = Ds;
This. gridview1.databind ();


}

In order to facilitate the use of gridview to bind data (we can also store data in XML documents ). Create an HTML page (htmlpage.htm) and call the. ASPX page using Ajax technology. XMLHttpRequest provides two attributes used to access server responses: responsetext and responsexml. Here, because I use the gridview to store data. Therefore, we use the responsetext attribute (it returns a string, that is, an HTML string ). If we use XML to store data, we should use the responsexml attribute. The code for .html is as follows:

<! 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>
<Title> No title page </title>
<Type = "text/Java">
VaR XMLHTTP

VaR page
Crrate ()
{
If (activexobject ){
XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
}
Else if (XMLHttpRequest ){
XMLHTTP = new XMLHttpRequest ();
}
}
// Initialize to the first page
Star ()
{Page = 1;
Crrate ()
XMLHTTP. onreadystatechange = statechanged;
XMLHTTP. Open ("get", "default. aspx", true)
XMLHTTP. Send (null)
}
// Next page
Next ()
{Page = page + 1
STR = getelementbyid ("text1 ").;
Getelementbyid ("txthint"). innerhtml = "";
VaR url = "default. aspx? Next = next & name = "+ page;
Crrate ();
XMLHTTP. onreadystatechange = statechanged;
XMLHTTP. Open ("get", URL, true );
XMLHTTP. Send (null)
}
// Jump to a page
Go ()
{
STR = getelementbyid ("text1 ").;
Page = STR;
Getelementbyid ("txthint"). innerhtml = "";
VaR url = "default. aspx? Next = next & name = "+ page;
Crrate ();
XMLHTTP. onreadystatechange = statechanged;
XMLHTTP. Open ("get", URL, true );
XMLHTTP. Send (null)
}
// Previous Page
Prve ()
{
Page = page-1
STR = getelementbyid ("text1 ").;
Getelementbyid ("txthint"). innerhtml = "";
VaR url = "default. aspx? Next = next & name = "+ page;
Crrate ();
XMLHTTP. onreadystatechange = statechanged;
XMLHTTP. Open ("get", URL, true );
XMLHTTP. Send (null)

}
// Parse the string provided by the server response
Statechanged ()
{
If (XMLHTTP. readystate = 4)
{If (XMLHTTP. Status = 200 ){
Getelementbyid ("txthint"). innerhtml = XMLHTTP. responsetext;
}
}
}
Setinterval ('Star ()');
</>
</Head>
<Body>
<Div id = "txthint"> </div>
</Body>
<Input id = "text1" type = "text" style = "width: 20px"/> <input id = "button3" type = "button"
= "Go" = "Go ()"/> <input id = "button1" type = "button" = "Next" = "next ()"/> <Input
Id = "button2" type = "button" = "Previous Page" = "prve ()"/>
</Html>

Code Description (I will not elaborate on AJAX knowledge points): url = "default. aspx? Next = next & name = "+ page; pass next = next & name =" + page to the. ASPX page, where page is the page number to be displayed .. After receiving the ASPX page, it will run: If (request. querystring ["Next"] = "Next ")
{
Temp = convert. toint32 (request. querystring ["name"]);
Getveiw (temp );

} The statement is very simple.

Such a simple instance with no additional paging is complete. Due to my limited JS level, I can only do this now. Of course, you can also add some new features. Here I just want to share my methods with you. As for the function, it will be improved later !!!

PS:There are still many methods on the Internet. One of the methods is to parse the gridview and use its own paging technology to implement specific methods, see http://zfnh2002.bokee.com/viewdiary.12243206.html. This method is not applicable because the pagination of the gridview itself is to retrieve data and then pagination, the efficiency is obviously very low. Another method is to use the. NET Ajax architecture (ajax.net or alax) to achieve no refreshing paging. This method is best. There will be more than n methods to search from Baidu.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.