asp.net using ObjectDataSource controls to implement AJAX real-page _ practical tips in asp.net

Source: Internet
Author: User
The ListView control itself does not have paging capability, With the new DataPager controls in ASP.net, however, we can easily set pagination for the data in ListView, which requires developers to write a line of code, place the ListView control on the page, set the layout and DataSource, and then add a datapage R control, set its Pagedcontrolid property to set the number of data bars to display per page in ListView's Id,pagesize, and then set the pagination style in fields (you can definitely do without the pipe style, ASP. NET defines the paging UI according to the built-in styles, and when you run the Web program, you see a ListView page that supports pagination, and the whole process is simple. In ASP.net 3.5, Microsoft separates data-bound controls from pagination controls so that users can set up pagination anywhere on the page and define a variety of page styles according to their needs, and the paging control can control any data-bound control. They are specified by the Pagedcontrolid property, and basically the developers can do whatever they want with the paging operation. How to use the ListView and DataPager controls is not the focus of this article, and interested readers can check out Microsoft MSDN and I think it should be much more detailed than I said.

First of all, the principle of data paging. When we are developing a Web application for a data-bound page, often encountered in the case of more data, in order to prevent the page becomes too large load data slow problem, we will be a page to display the data through pagination to complete, users visit the page through the paging function to view the data in different pages, This is a very good solution, and almost all of the program designers and developers will be happy this way to use pagination to display the data on the page, this is no problem! The problem is the way the page is paginated.

    in general, the simplest way to do this is to read all the pages ' data into the cache medium at once, which is typically the server's memory, and then display only one page of data at a time. This approach is easy to implement, and almost all of the data-bound controls that support pagination have been used in this way before asp.net, so many asp.net beginners have used this approach to develop pagination data-binding pages without noticing any problems. Yes, the most simple and effective method in program development is generally not a problem, and the standard controls provided by Microsoft do so, what are the problems? For some small web applications, this really does not matter, because it involves a small amount of data, even if we read all the data into memory, at best a few trillion, a little more than more than 10 trillion, a few 10 trillion. If these data are pure text (in general, we keep the data in the database are text information), a few 10 trillion data is already thousands of records, now the server hardware conditions are relatively good, memory in the G level above, to deal with this data is not alone. However, if a table in the database reaches billions of records, and some fields are storing file data (that is, binary data), so it is not ideal to read all of the data into memory at once, and this time you need to read the data in a "true paging" way.

In most cases, we still need to use a "real paging" approach to get the data. Given the starting position of each page record (or the index of the page), and given the number of bars and total records for each page of data, we want to fetch only the current page's data each time. Each time the user paging, based on these conditions from the database to take part of the data binding to the page, this can greatly reduce the cost of the server, and a large amount of data is not a problem. This approach seems to be ideal, however, combined with the needs of users, we will find that even if the use of "real paging" way to page the data access, but also encounter problems. Just imagine that in today's Ajax-infested web world, sites that use Ajax to improve the user experience abound, and if you happen to have an AJAX-provided pagination data binding page, the problem arises. Because the Ajax user experience effect is a partial refresh of the page, in the Pagination data binding page, the page will update the paging data at a faster rate after the user clicks the paging button, which is pretty good for the user, but greedy users may want to try clicking the paging button frequently, Even the crazy user dot paging button, this time your application because of the need to go to the database to get the paging data very often too late to update the data on the page and the script error, the end of the user experience is the page paging function is not normal, the program crashes.

The combination of "true pagination" and "fake pagination" can be a very effective solution to the problem mentioned above. I refer to the first type of data paging described above as "fake paging", while the second type of data paging is called "true paging". The combination of the two pages, that is, one-time reading of n-page data to the cache, paging, as needed to determine whether to get the data directly from the cache or to reload the data from the database into the cache. After all, it is much more efficient to load data from the cache. This way, each time the user clicks the paging button, as long as the data exists in the cache, it can load the data at a very fast rate, and reload the new N-page data from the database to the cache if the cache expires or the user gets more data than is cached. Of course, the process of updating the cache allows you to use synchronization in Ajax to limit the user's UI actions in this process.

In fact, the details involved in the page is a lot of detail, to be detailed and to explain all of these problems, it is not enough to rely on a few words in this article, I just want to introduce you to a asp.net ajax way of real paging programming method. In order to make it easier to use AJAX, I used the AJAX controls in Microsoft's Ajaxtoolkit package directly in Visual Studio, and these controls are generally pretty good, and the use of these controls is not covered here.

Before writing this article I also looked up a lot of data, in fact, everyone in the development of data-bound pages will generally adopt a "real page" way to the data processing, asp.net 3.5 of the DataPager control is a good control for data paging, Some people put Microsoft's data-bound controls do not support the data "true paging" defects into its head, I think it is wrong about it. DataPager is responsible for paging operations, regardless of the data source, and it is more important to work with the paging UI and with the user interaction. So how does the data source work? How do data-bound controls know how many pages my data source is divided into, what page do I currently take?

These problems have been a pain to me, I have tried to use. NET PagedDataSource object to the data paging, but later found that the object is also need to read all the data in memory in order to support paging, plainly, it is also a "false paging" data source object, and DataGrid, the GridView no different. Remember, starting with. NET 2.0, Microsoft provides a range of data source controls (such as SqlDataSource, XmlDataSource, LinqDataSource, and so on) to simplify specifying data sources for data-bound controls. In fact, I think these controls have little value in addition to simplifying the code, and sometimes it destroys the structure of the program itself, and I have always objected to the use of these controls directly on the page (of course, it's very handy to do some demo programs using these controls). But I accidentally saw the ObjectDataSource control in the Visual Studio Toolbox while I was studying AJAX real paging, and at first I just thought it was supposed to be the base control for those datasource controls, and then I knew by looking at the data, This control is the only control in all datasource controls that supports the "true paging" operation, which can achieve data paging by setting a few simple properties, and I'll show you how to use this control.

The use of this control is very simple, we only need to configure a few properties on it.

SelectMethod: Specifies the name of the method used to get the paging data. This method is a custom. net method, you can write the name of the method to the SelectMethod of the ObjectDataSource control in the Codebehind code of the page. The ObjectDataSource control automatically executes the method you specify by way of a delegate.

TypeName: The full name of the class that uses the ObjectDataSource control (including namespace and class name). This attribute must be specified by ASP. NET loads the corresponding methods and objects through reflection.

dataobjecttypename: The type full name of the data source object. The biggest bright spot of the ObjectDataSource control is its full support for object-oriented data manipulation. In layered application development, the code in the data Access Layer abstracts the tables in the database into class objects and abstracts the fields from the database tables into the attributes in the class object, as specified by the DataObjectTypeName property.

EnablePaging: If you want to turn on the data paging feature, you need to set the value of this property to true.

maximumrowsparametername: The value of this property is a parameter name (just a parameter name, not the number of data bars per page) that indicates the number of bars to display data per page. The ObjectDataSource control passes the parameter and executes the code in the method specified by the delegate in the previous SelectMethod property. Note that the name of this parameter must be exactly the same as the parameter name in the method specified by the SelectMethod property.

StartRowIndexParameterName: This property is also a parameter name that indicates the index of the starting record for each page. Usage is the same as MaximumRowsParameterName.

SelectCountMethod: This property is the signature of a method that tells the ObjectDataSource control how to know the total number of records in the data source. The ObjectDataSource control also executes this method through a delegate, so the signature of the method must be exactly the same as the value of the property.

Then we place a ListView control (or any other data-bound control) on the page, set the value of its DataSourceID property to the ObjectDataSource ID, and then add a DataPager control. Set the value of the Pagedcontrolid property to the ID of the ListView.

This is the structure diagram of the three data tables in the data source that I took, where the primary table is a shoutout table, and a record in shoutout corresponds to multiple images, which are associated through the Basecomment table. Below I will give you the code to get the stored procedure for shoutout paging data.

Copy Code code as follows:

<%@ Page language= "C #" autoeventwireup= true "codebehind=" AllShoutout.aspx.cs "inherits=" Shoutoutwalltest.allshoutout "%>

<%@ Register assembly= "AjaxControlToolkit, version=3.0.20820.415, Culture=neutral, publickeytoken= 28f01b0e84b6d53e "
Namespace= "AjaxControlToolkit" tagprefix= "Ajaxtoolkit"%>

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<title>untitled page</title>
<link href= "Css/style.css" rel= "stylesheet" type= "Text/css"/>
<body>
<form id= "Form1" runat= "Server" >
<asp:scriptmanager id= "ScriptManager1" runat= "Server" >
</asp:ScriptManager>
<div id= "Shoutoutall" >
<div style= "Float:left;" >
<asp:updatepanel id= "UpdatePanel1" runat= "Server" updatemode= "Conditional" >
<ContentTemplate>
<asp:objectdatasource id= "ObjectDataSource1" runat= "Server" selectmethod= "Loadshoutouts"
Typename= "Shoutoutwalltest.allshoutout" dataobjecttypename= "Model.shoutout" enablepaging= "True"
Maximumrowsparametername= "MaxRows" startrowindexparametername= "StartIndex" selectcountmethod= "Countall" ></ Asp:objectdatasource>
<div id= "Shoutoutalldescription" >
<asp:listview id= "Lvshoutout" datasourceid= "ObjectDataSource1" runat= "Server" itemplaceholderid= " Layouttabletemplate "
Datakeynames= "ID" onitemdatabound= "Lvshoutout_itemdatabound" >
<LayoutTemplate>
<div id= "layouttabletemplate" runat= "Server" >
</div>
</LayoutTemplate>
<ItemTemplate>
<div class= "Shoutoutallcontent" >
<div class= "Shoutoutalltext" >
<% #Eval ("Description")%></div>
<div>
<!--ADD images here-->
<asp:listview id= "lvimages" runat= "Server" itemplaceholderid= "layoutimages" Datasource= ' <% #Eval ("Images")% > ' >
<LayoutTemplate>
<div id= "layoutimages" runat= "Server" >
</div>
</LayoutTemplate>
<ItemTemplate>
<a href= ' thumbnail.aspx?isthumbnail=false&basecommentid=<% #Eval ("Basecommentid"). ToString ()%>&imagetitle=<% #Eval ("Title")%> '
target= "_blank" >
&imagetitle=<% #Eval ("Title")%> '
alt= "" class= "shoutoutimg"/></a>
</ItemTemplate>
</asp:ListView>
</div>
<div class= "shoutoutallposted" >
Posted by:<% #Eval ("Postedbyname")%> <%# ((DateTime) Eval ("Posteddate"). ToShortDateString ()%></div>
<div class= "Shoutoutallfooter" >
<asp:button id= "Btedit" cssclass= "Shoutoutalllistbutton" onclick= "Btedit_click" runat= "Server"
text= "Edit"/>
<asp:button id= "Btdel" cssclass= "Shoutoutalllistbutton" onclick= "Btdel_click" runat= "Server"
text= "Delete" onclientclick= "return confirm (' Are you sure Delete it? ');"/>
</div>
</div>
</ItemTemplate>
</asp:ListView>
</div>
<div class= "Shoutoutallfooter" >
<asp:datapager id= "DataPager1" runat= "Server" pagedcontrolid= "Lvshoutout" pagesize= ">"
<Fields>
<asp:nextpreviouspagerfield buttontype= "Image" firstpagetext= "Go to" and "firstpageimageurl="./images/ Shoutout_viewall_left.gif "showfirstpagebutton=" true "shownextpagebutton=" false "
Showpreviouspagebutton= "false"/>
<asp:numericpagerfield numericbuttoncssclass= "Shoutoutallnumericpager" buttontype= "button" Previouspageimageurl= "./images/shoutout_viewall_left.gif" nextpreviousbuttoncssclass= "Shoutoutallnextprepager" nextpagetext= ">>" previouspagetext= "<<" currentpagelabelcssclass= "Shoutoutallcurrentpager" buttoncount= "5"/>
<asp:nextpreviouspagerfield buttontype= "Image" lastpagetext= "Go" to the last page "Lastpageimageurl="./images/shoutout _viewall_right.gif "showlastpagebutton=" true "shownextpagebutton=" false "
Showpreviouspagebutton= "false"/>
</Fields>
</asp:DataPager>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</div>
</form>
</body>



I put both the data-bound control and the paging control in the Uploadpanel control so that the page performs the data-binding and paging operation without refreshing. A nested listview is used in the code because a shoutout record corresponds to multiple Image records, combining the data entity class of the data layer, there is a property similar to list<image> images in the Shoutout class. So I took this attribute directly as the data source for the ListView control, which is used primarily to display thumbnails in each shoutout record. As for how to display thumbnails in the page is not the focus of this article, do not introduce here. In the code we have given the ObjectDataSource control the parameter name or method signature that is used for data paging, we need to implement these methods below.

There are only two methods, the Loadshoutouts () method is used to get the collection of data object shoutout, that is, the return value of the list<shoutout> type, in fact, the method only needs to execute the stored procedure used in the database for paging. This stored procedure can return both the data collection and the total number of record bars. Below I will give this stored procedure. The Countall () method only returns the total number of record bars.
Copy Code code as follows:

Using System;
Using System.Collections;
Using System.Configuration;
Using System.Data;
Using System.Linq;
Using System.Web;
Using System.Web.Security;
Using System.Web.UI;
Using System.Web.UI.HtmlControls;
Using System.Web.UI.WebControls;
Using System.Web.UI.WebControls.WebParts;
Using System.Xml.Linq;
Using System.Collections.Generic;
Using Model;
Using BLL;

Namespace Shoutoutwalltest
{
public partial class AllShoutout:System.Web.UI.Page
{
public static list<shoutout> List = null;
private static int ItemCount = 0;

protected void Page_Load (object sender, EventArgs e)
{
}

Public list<shoutout> loadshoutouts (int startIndex, int maxRows)
{
int itemCount;
int pageIndex = 1;
if (StartIndex > 0)
{
PageIndex = (startIndex)/25 + 1;
}
List = Shoutoutbll.getshoutouts (PageIndex, MaxRows, True, out itemCount);
ItemCount = ItemCount;
return list;
}

public int Countall ()
{
return ItemCount;
}

<summary>
Refresh data after updating and deleting.
</summary>
private void RefreshData ()
{
Lvshoutout.datasourceid = objectdatasource1.id;
}
}
}


My code requires 25 data per page, Shoutoutbll.getshoutouts () method has 5 parameters, the first parameter is used to specify the criteria for retrieving data, this is a special case in the program, the reader can not care; The second parameter is the index of the page, and the rule starts from 1, I converted from startindex to pageindex in the method; The third parameter is the number of rows displayed per page, the fourth parameter is out type, and the total number of rows is returned, this method is mainly to correspond to the stored procedure that executes the database, the specific code in the BLL namespace, Code that belongs to the business logic layer is no longer specified here, code in the model namespace is used primarily to return database entity objects, such as shoutout and image objects. The RefreshData () method assigns a value to the DataSourceID property of the ListView control so that the data can be rebind to the effect of refreshing the data.
The image above is a part of the screenshot after the program is run, you can see that the paging UI has been shown, and for the paging operation, I did not write a line of code, which is entirely controlled by DataPager itself. Because the ListView and DataPager controls are all in the UpdatePanel control, the page only updates the data in the ListView when the user clicks the page Break button and does not refresh the entire page, and the data is paged out of the database, thus implementing the Ajax Real paging operation. The core control is ObjectDataSource. Here is the stored procedure I used to get the paging data, and the reader can draw on the fact that this stored procedure takes the form of a temporary table for paging data.
Copy Code code as follows:

Set ANSI_NULLS on
SET QUOTED_IDENTIFIER ON
Go

ALTER PROCEDURE [dbo]. [Getshoutouts]
--Add The parameters for the stored procedure
(
@LocationID INT,
@PageIndex INT,--start from 1.
@PageSize INT,
@showimages BIT,
@ItemCount INT Output
)
As
BEGIN
---SET NOCOUNT on added to prevent extra result sets from
--interfering with SELECT statements.
SET NOCOUNT on;

Declare @beginRowNumber bigint, @endRowNumber bigint
Set @beginRowNumber = (@PageIndex-1) * @PageSize +1;
Set @endRowNumber = @PageIndex * @PageSize;

With Temppagingrecord as
(
SELECT row_number () over (order by Posteddate DESC) as recordnumber,so.id as Shoutoutid, BC. [Description], BC. Postedbyname, BC. Posteddate,null as imagetitle,null as imageblob,null as type,bc.id as BASECOMMENTID,BC. Displayusername,
Bc. IsVisible, so. Notifytoshoutoutuser, so. Shoutouttouseralias
FROM dbo. Shoutout as So
JOIN dbo. Basecomment as BC on bc.id = so. Basecommentid
WHERE so. LocationID = @LocationID
and BC. IsVisible = 1
)
SELECT recordnumber,
Shoutoutid,
Description,
Postedbyname,
Posteddate,
Imagetitle,
Imageblob,
Basecommentid,
Displayusername,
IsVisible,
Notifytoshoutoutuser,
Shoutouttouseralias
Into #tempTable
From Temppagingrecord
Where recordnumber between @beginRowNumber and @endRowNumber

--Insert statements for procedure
IF (@showimages = 1)
Begin
Select RecordNumber,
Shoutoutid,
Description,
Postedbyname,
Posteddate,
IM. Imagetitle,
IM. Imageblob,
IM. Type,
T.basecommentid,
Displayusername,
IsVisible,
Notifytoshoutoutuser,
Shoutouttouseralias from #tempTable T
Left JOIN dbo. Image im on IM. Basecommentid = T.basecommentid
ORDER BY Posteddate DESC
End
ELSE
Begin
SELECT * from #tempTable
ORDER BY Posteddate DESC
End

SELECT @ItemCount = Count (*)
From Shoutout as So
JOIN dbo. Basecomment as BC on bc.id = so. Basecommentid
WHERE so. LocationID = @LocationID
and BC. IsVisible = 1
End

Personally feel that the ObjectDataSource control is a more intelligent control, it through the function of the delegate to automatically implement the user-provided paging code to complete the database "real paging" operation, save the development process of a lot of trouble, or it is necessary to seriously study the.

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.