asp.net turning pages without a refresh is as simple as that

  • 2020-05-09 18:26:32
  • OfStack

I like to use Repeater, because of its simplicity, this AjaxPager is oriented to Repeater!
Step 1 step 1 look:
code
 
[DefaultProperty("TotalRecord"), 
ToolboxData("<{0}:AjaxPager runat=server></{0}:AjaxPager>")] 
public class AjaxPager : WebControl,ICallbackEventHandler 
{ 
public AjaxPager() 
: base(HtmlTextWriterTag.Div) 
{ 
this.Load += new EventHandler(AjaxPager_Load); 
} 
void AjaxPager_Load(object sender, EventArgs e) 
{ 
string script = "function AjaxPagerCallBack(returnData){var parts =returnData.split('[_]'); document.getElementById('" + this.UniqueID.Replace ('$','_') + "').innerHTML = parts[0];document.getElementById('" + Info.ContainID + "').innerHTML=parts[1]}"; 
this.Page.ClientScript.RegisterClientScriptBlock(this.Page.GetType(), "AjaxPagerCallBack", script, true); 
} 
} 

Here, in the Load event, a section of JS is registered to the page. The AjaxPagerCallBack method does two operations, putting the data it represents into the DIV container it generates on the client side, div for this.UniqueID.Replace ('$','_'),ClientID seems to work too! Ha, one is silly! The second step is to put the paging data into div with id of Info.ContainID, which is described below.
Variable attributes
 
#region  variable  
private string _BarBackGroundColor = "#FFFFFF"; 
private string _BarLinkColor = "Navy"; 
private string _BarCurrentColor = "#EEEEEE"; 
private int _TotalRecord = 50; 
private int _TotalPage = 0; 
private int _CurrentIndex = 1; 
private int _ItemSize = 10; 
private PageInfo _Info=new PageInfo (); 
#endregion 
#region  attribute  
#region  appearance  
[Description(" Paging background color "), 
Bindable(true), 
Category(" appearance "), 
DefaultValue("#FFFFFF")] 
public string BarBackGroundColor 
{ 
get { return _BarBackGroundColor; } 
set { _BarBackGroundColor = value; } 
} 
[Description(" Page bar links number color "), 
Bindable(true), 
Category(" appearance "), 
DefaultValue("Navy")] 
public string BarLinkColor 
{ 
get { return _BarLinkColor; } 
set { _BarLinkColor = value; } 
} 
[Description(" Pagination bar current page number color "), 
Bindable(true), 
Category(" appearance "), 
DefaultValue("#EEEEEE")] 
public string BarCurrentColor 
{ 
get { return _BarCurrentColor; } 
set { _BarCurrentColor = value; } 
} 
#endregion 
#region  behavior  
[Description(" The total number of records "), 
Category(" behavior "), 
DefaultValue(50)] 
public int TotalRecord 
{ 
get { return _TotalRecord; } 
set 
{ 
_TotalRecord = value; 
} 
} 
[Description(" Total number of pages "), 
Category(" behavior "), 
DefaultValue(0)] 
public int TotalPage 
{ 
get { return _TotalPage; } 
} 
[Description("Bar The size of the "), 
Category(" behavior "), 
DefaultValue(10)] 
public int BarSize 
{ 
get { return _ItemSize; } 
set 
{ 
foreach (char c in System.Convert.ToString(value)) 
{ 
if (!Char.IsNumber(c)) 
{ 
_ItemSize = 10; 
break; 
} 
} 
_ItemSize = value; 
} 
} 
[Description(" The current page value "), 
Category(" behavior "), 
DefaultValue(1)] 
public int PageIndex 
{ 
get { return _CurrentIndex; } 
set { _CurrentIndex = value; } 
} 
#endregion 
public PageInfo Info 
{ 
get { return _Info; } 
set { _Info = value; } 
} 
#endregion 

There is no need to go into details here. Among them, PageInfo is as follows:
PageInfo
 
[Serializable] 
public class PageInfo 
{ 
private string _RepeaterUniqueID; 
private string _ContainID="AjaxData"; 
private string _TableName = string.Empty; 
private string _IdentityField = "ID"; 
private int _PageSize = 10; 
private string _Fields = "*"; 
private bool _IsDesc = true; 
private string _Content = string.Empty; 
private string _ConnectStringName = string.Empty; 
public string RepeaterUniqueID 
{ 
get { return _RepeaterUniqueID; } 
set { _RepeaterUniqueID = value; } 
} 
public string ContainID 
{ 
get { return _ContainID; } 
set { _ContainID = value; } 
} 
public int PageSize 
{ 
get { return _PageSize; } 
set 
{ 
_PageSize = int.Parse(value.ToString()); 
} 
} 
public string TableName 
{ 
get { return _TableName; } 
set { _TableName = value; } 
} 
public string IdentityField 
{ 
get { return _IdentityField; } 
set { _IdentityField = value; } 
} 
public string Fields 
{ 
get { return _Fields; } 
set { _Fields = value; } 
} 
public bool IsDesc 
{ 
get { return _IsDesc; } 
set { _IsDesc = value; } 
} 
public string Content 
{ 
get { return _Content; } 
set { _Content = value; } 
} 
public string ConnectStringName 
{ 
get { return _ConnectStringName; } 
set { _ConnectStringName = value; } 
} 
} 

This is marked Serializable, because I'm going to save it in ViewState.
Helper method
 
private string GetContents() 
{ 
this._TotalPage = ((this.TotalRecord / this.Info.PageSize) * this.Info.PageSize == this.TotalRecord) ? (this.TotalRecord / this.Info.PageSize) : ((this.TotalRecord / this.Info.PageSize) + 1); 
int BeginRecord = (this.PageIndex - 1) * this.Info.PageSize + 1; 
int EndRecord = Math.Min(this.PageIndex * this.Info.PageSize, this.TotalRecord); 
string PageInfo = string.Format("[ Each page <span style='color:#CC0000'>{0}({1}-{2})</span> article    A total of <span style='color:#CC0000'>{3}</span> article <span style='color:#CC0000'>{4}</span> page ]", Info.PageSize, BeginRecord, EndRecord, this.TotalRecord, this.TotalPage); 
StringBuilder PageListStr = new StringBuilder(); 
string PageIndexColor = "#000000"; 
int SingleNumber = this.TotalPage - (TotalPage / BarSize) * BarSize; 
int IntPageForMax = (this.PageIndex - 1) / BarSize; 
int MinInt = (1 + BarSize * IntPageForMax); 
int MaxInt = ((IntPageForMax + 1) * BarSize) > TotalPage ? TotalPage : ((IntPageForMax + 1) * BarSize); 
if (this.TotalRecord == 0 || this.TotalPage == 0) 
{ 
PageListStr.AppendFormat("<span style='color:'{0};margin:auto 3px;'>0</span>", PageIndexColor); 
PageListStr.AppendFormat(" [ A total of <span style='color:#CC0000'>0</span> page / The current first <span style='color:#CC0000'>0</span> page   A total of <span style='color:#CC0000'>0</span> records , Current number of records <span style='color:#CC0000'>0</span> to <span style='color:#CC0000'>0</span>]"); 
return PageListStr.ToString(); 
} 
else 
{ 
if (this.TotalPage <= this.BarSize) 
{ 
for (int i = 1; i <= TotalPage; i++) 
{ 
PageIndexColor = PageIndex == i ? "#CC0000" : "#000000"; 
if (PageIndex == i) 
PageListStr.AppendFormat("<a id='{0}' style='color:{1};margin:auto 3px;'>{2}</a>", this.UniqueID, PageIndexColor, i); 
else 
PageListStr.AppendFormat("<a id='{0}' style='color:{1};margin:auto 3px;' href=\"javascript:{2}\">{3}</a>", this.UniqueID, PageIndexColor, Page.ClientScript.GetCallbackEventReference(this, i.ToString(),"AjaxPagerCallBack",null), i); 
} 
PageListStr.AppendFormat(" {0}", PageInfo); 
return PageListStr.ToString(); 
} 
else 
{ 
for (int i = MinInt; i <= MaxInt; i++) 
{ 
PageIndexColor = PageIndex == i ? "#CC0000" : "#000000"; 
if (PageIndex == i) 
PageListStr.AppendFormat("<a id={0}' style='color:{1};margin:auto 3px;'>{2}</a>", this.UniqueID, PageIndexColor, i); 
else 
PageListStr.AppendFormat("<a id='{0}' style='color:{1};margin:auto 3px;' href=\"javascript:{2}\">{3}</a>", this.UniqueID, PageIndexColor, Page.ClientScript.GetCallbackEventReference(this, i.ToString(), "AjaxPagerCallBack", null), i); 
} 
if (PageIndex <= BarSize && TotalPage > BarSize) 
{ 
PageListStr.AppendFormat("<a id='{0}' href=\"javascript:{1}\"> Under the 1 page </a>", this.UniqueID, Page.ClientScript.GetCallbackEventReference(this, System.Convert.ToString(BarSize + 1), "AjaxPagerCallBack", null)); 
} 
if (this.PageIndex > BarSize && (TotalPage - this.PageIndex) >= SingleNumber) 
{ 
int MultiMinPageIndex = (IntPageForMax * BarSize); 
int MultiMaxPageIndex = ((IntPageForMax + 1) * BarSize) + 1; 
PageListStr.Insert(0, string.Format("<a id='{0}' href=\"javascript:{1}\"> on 1 page </a>", this.UniqueID, Page.ClientScript.GetCallbackEventReference(this, MultiMinPageIndex.ToString(),"AjaxPagerCallBack",null))); 
PageListStr.AppendFormat("<a id='{0}' href=\"javascript:{1}\"> Under the 1 page </a>", this.UniqueID, Page.ClientScript.GetCallbackEventReference(this, MultiMaxPageIndex.ToString(),"AjaxPagerCallBack",null)); 
} 
if (PageIndex > 10 && (TotalPage - PageIndex) < SingleNumber) 
{ 
int MultiMinPageIndex = (IntPageForMax * BarSize); 
PageListStr.Insert(0, string.Format("<a id='{0}' href=\"javascript:{1}\"> on 1 page </a>", this.UniqueID, Page.ClientScript.GetCallbackEventReference(this, MultiMinPageIndex.ToString(), "AjaxPagerCallBack", null))); 
} 
PageListStr.AppendFormat(" {0}", PageInfo); 
return PageListStr.ToString(); 
} 
} 
} 
public void BindData() 
{ 
Repeater rpt = getRpt(); 
rpt.Visible = true; 
SqlHelper helper; 
helper = this.Info.ConnectStringName.IsNullOrEmpty() ? new SqlHelper() : new SqlHelper(Info.ConnectStringName); 
if (this.Info.RepeaterUniqueID.IsNullOrEmpty()) 
{ 
throw new Exception(" You must give Info the RepeaterUniqueID Attribute assignment "); 
} 
int count = 0; 
DataTable dt = helper.GetPageData(Info.TableName, Info.Fields, Info.IdentityField, Info.PageSize, PageIndex, Info.IsDesc, Info.Content, out count); 
this.TotalRecord = count; 
rpt.DataShow(dt); 
} 
private Repeater getRpt() 
{ 
return this.Page.FindControl(this.Info.RepeaterUniqueID) as Repeater; 
} 

Thanks first to the person who wrote Pager, I only made a few changes in GetContents, otherwise I would have to go into details!!
BindData(using my SqlHelper) USES the DataBind() method for the server to put data in repeater, but not to show it, heh heh!
getRpt just finds the Repeater reference
Maintaining view state
 
#region  Maintaining view state  
protected override void LoadViewState(object savedState) 
{ 
Triplet tp = savedState as Triplet; 
this.TotalRecord = Convert.ToInt32(tp.Third); 
this.Info = tp.Second as PageInfo; 
base.LoadViewState(tp.First); 
} 
protected override object SaveViewState() 
{ 
Triplet tp = new Triplet(); 
tp.First = base.SaveViewState(); 
tp.Second = Info; 
tp.Third = this.TotalRecord; 
return tp; 
} 
#endregion 

I don't have to say it here, but PageInfo1 must be able to Serializable.
Overriding methods
 
#region  Overriding methods  
protected override void RenderContents(HtmlTextWriter writer) 
{ 
writer.Write(GetContents()); 
base.RenderContents(writer); 
} 
protected override void AddAttributesToRender(HtmlTextWriter writer) 
{ 
writer.AddStyleAttribute("White-space", "nowrap"); 
writer.AddStyleAttribute("padding-top", "2px"); 
writer.AddStyleAttribute("padding-bottom", "2px"); 
writer.AddStyleAttribute("color", "#949494"); 
writer.AddStyleAttribute("font-weight", "bold"); 
writer.AddStyleAttribute("background-color", this.BarBackGroundColor); 
base.AddAttributesToRender(writer); 
} 
#endregion 

Needless to say, everyone can see that.
Implement ICallbackEventHandler
 
#region ICallbackEventHandler  Members of the  
public string GetCallbackResult() 
{ 
StringBuilder sb=new StringBuilder (); 
StringWriter sw=new StringWriter (sb); 
getRpt().RenderControl(new HtmlTextWriter(sw)); 
return this.GetContents() + "[_]" + sb.ToString(); 
} 
public void RaiseCallbackEvent(string eventArgument) 
{ 
int pageindex = int.Parse(eventArgument); 
this._CurrentIndex = pageindex; 
BindData(); 
} 
#endregion 

RaiseCallbackEvent was executed first on the callback, so CurrentIndex changed and BindData() was executed!!
Return to perform GetCallbackResult at time, string is separated by "[_]", corresponding to var parts = returnData.split ('[_]]) in the AjaxPagerCallBack js method registered above;
OK! Simple Ajax pagination is done!!
The Northwind Orders table calls are as follows:
The page Repeater is included in < div id="AjaxData" > < /div > In the
code
 
private void BindPage(string content) 
{ 
SinoHelper.PageInfo info = new SinoHelper.PageInfo(); 
info.PageSize = 5; 
info.RepeaterUniqueID = rpt.UniqueID; 
info.TableName = "Orders"; 
info.Fields = "OrderID,CustomerID,ShipCity"; 
info.IdentityField = "OrderID"; 
info.Content = content; 
AjaxPager1.Info = info; 
AjaxPager1.BindData(); 
} 

Attached to the download:
asp.net no refresh page

Related articles: