Aspnetpager true and false pagination control example

Source: Internet
Author: User

learn from the beginning BS It's been a while.

The design of BS is a Web page design that contains data extracted from the database. displayed on the page. Once in CS , it was displayed using a tabular control such as the GridView , because the data was small. And there are rollers on the right side.

So I never thought about paging the data. So this is a big mistake.

Now it's not too late to react. Next, let's touch the paging.

Disadvantages of Not paging:

the query operations on big data.

1 , data volume is too large, window loading time is too slow

2 , the amount of data displayed is too large and the user looks uncomfortable.

Two ways to split pages:

False paging:

At the time of running the query, all the data are queried, and then jump to the page when There is no need to query.

True paging:

When you run a query operation, only the contents of the current page that is displayed are queried for display. After the jump page also need to query the database to fetch the corresponding data.

In the case of large data volumes, compare:

in the case of small data, because today's computer processing speed is fast enough to use real paging and false paging user experience is no different.

for information on how to add Aspnetpager controls, borrow the following article:

http://blog.csdn.net/u010066934/article/details/38374111

True and false Pagination example result diagram:

Use the own GridView table to display the data. Use the Aspnetpager control for paging.

How to use Aspnetpager please read---。

I will not dwell on it.

html main interface:

<table class= "Auto-style1" > <tr> <td>                        <webdiyer:aspnetpager id= "Anptop" runat= "Server" pagesize= "5" onpagechanged= "anp_pagechanged" >                </webdiyer:AspNetPager> </td> </tr> <tr> <td class= "Auto-style2" > <asp:gridview id= "GridView1" ru                nat= "Server" > </asp:GridView> </td> </tr> <tr> <td> <webdiyer:aspnetpager id= "Anpbottom" runat = "Server" clonefrom= "Anptop" cssclass= "ANP" onpagechanged= "anp_pagechanged" pagesize= "5" > </w ebdiyer:aspnetpager> </td> </tr> </table> 


First, set a paging control at the header, and then copy the above control to the exact part, so that it achieves a synchronous effect.

Database Connection class:

/************************************************* * Zhao Chong * Group: * Description: * Date Created: 2014/8/3 14:34:46* version: v1.0.0***************** /using system;using system.collections.generic;using system.linq;using system.web ; using system.data;using system.data.sqlclient;namespace news{public class DB {public static SqlConnection Createcon () {return new SqlConnection ("server=.;        database=aspnetpagertest;uid=sa;pwd=123456 ");            } public static int count () {SqlConnection con = Createcon (); Con.            Open ();            SqlCommand cmd = new SqlCommand ("SELECT count (*) from ANP", con); return (int) cmd.        ExecuteScalar ();            } public static SqlDataReader getsource (int start,int end) {SqlConnection con = Createcon (); Con.            Open ();            SqlCommand cmd= New SqlCommand ("SELECT * from ANP where ID between" +start+ "and" +end, con); SqlDataReader sdr= cmd. ExecuteReader();        return SDR;            } public static DataTable GetSource () {SqlConnection con = Createcon (); Con.            Open ();            SqlCommand cmd = new SqlCommand ("SELECT * from ANP", con); SqlDataReader SDR = cmd.            ExecuteReader ();            DataTable dt=new DataTable (); Dt.                        Load (SDR);        return DT; }    }}


In order to compare the true and false pagination. First look at the implementation of false paging:

Using system;using system.collections.generic;using system.linq;using system.web;using System.Web.UI;using System.web.ui.webcontrols;using system.data;using system.data.sqlclient;namespace news{public partial class JiaFenYe : System.Web.UI.Page {DataView dv = new DataView (DB).        GetSource ());            protected void Page_Load (object sender, EventArgs e) {//anptop.recordcount = Db.count (); Save the total number of records for the data into the paging control//gridview1.datasource = DB.   GetSource (1, 5);            The default selection of 5 records//gridview1.databind ();            Anptop.recordcount = Db.count (); Saves the total number of records in the data to the paging control in DV.             RowFilter = "id<=5";            The default first page shows 5 records gridview1.datasource = DV;           Gridview1.databind (); Bound view} protected void Anp_pagechanged (object sender, EventArgs e) {//response.write ("Start            Page number: "+ Anptop.startrecordindex +" <br> End page: "+ anptop.endrecordindex); int StartIndex = Anptop.startrecordindex;           In fact the record number int endIndex = Anptop.endrecordindex; Stop record number//dataview DV = new DataView (DB).            GetSource ()); Dv.      RowFilter = "id >=" + startIndex + "and id<=" + endIndex;            Query the record within the specified interval Gridview1.datasource = DV;           Gridview1.databind (); Bound View}}}


In a comparison. True Paging implementation:

Using system;using system.collections.generic;using system.linq;using system.web;using System.Web.UI;using System.web.ui.webcontrols;namespace news{public    partial class WebForm1:System.Web.UI.Page    {        protected void Anp_pagechanged (object sender, EventArgs e)        {            //response.write ("Start Page:" + Anptop.startrecordindex + "< Br> End Page: "+ anptop.endrecordindex);            int startIndex = Anptop.startrecordindex;       Number of start records of data            int endIndex = Anptop.endrecordindex;           Number of cutoff records for data            Gridview1.datasource = DB. GetSource (startindex,endindex);   Displays the data in the current interval            gridview1.databind ();        }        protected void Page_Load (object sender, EventArgs e)        {            anptop.recordcount = Db.count ();            Save the total number of records for the data into the paging control            Gridview1.datasource = DB. GetSource (1,5);   Default selection 5 records            gridview1.databind ();}}}    

By comparison with the above experimental results, the result of test is not obvious because the data is too small.

Just through the code implementation process, it can be seen that in the premise of big data, fake page loading is a very big problem.

Of course, the two types of paging have their own characteristics. Can be selected according to actual needs.

If you need to see the source code, please download it yourself:

http://download.csdn.net/detail/zc474235918/7734743


Aspnetpager true and false pagination control example

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.