Asp.net+jquery+.ashx文件实现分页思路_ASP.NET

ASP.NET

JavaScript ASP.NET PHP编程正则表达式 AJAX相关 ASP编程 JSP编程编程10000问 CSS/HTML Flex 脚本加解密 web2.0 XML/RSS 网页编辑器相关技巧安全相关网页播放器 Dart Vue.js

上一篇: Chrome内核下由ashx输出的js代码... 下一篇:把字符串转为HtmlTable演示动画

Asp.net+jquery+.ashx文件实现分页思路

发布时间：2022-04-16 发布网站：脚本宝典

脚本宝典收集整理的这篇文章主要介绍了Asp.net+jquery+.ashx文件实现分页思路，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

今天看到一个.java哥们写过的在页面直接请求数据列表的程序代码。它是实现选中客户联系人后，无刷新的弹出div罗列其它联系人列表的功能。忽然想到既然可以请求联系人列表，而且无刷新。那么取复杂的数据列表呢，后来想到了数据分页。我现在用了自己写的一个分页控件。但是效率有时候感觉不是很高，它是以用户控件＋存储过程＋分页处理类来实现分页的。但是无可避免的就碰到了刷新的问题即使分页很快，但是只要这“刷”的一下总是感觉很不爽。而且还要页面编译一遍，还要在服务端处理Viewstate。以及其它的性能损失。既然 .ashx 可以省略页面编译的过程。再把分页处理类挪到客户端，那应该是会性能提升不少，还没有刷新，一定很爽，想到就做。

我定的思路是： .ashx程序中，编写好取得不同页码的程序。在页面布局好的前提下，留下数据区域 div。然后在页面请求 .ashx程序生成下一页的htML代码。覆盖div.innerHTMl 。
首先是页面，因为是要实践思路，所以页面真是很简单。引用了jquery.js

复制代码代码如下:

然后编写.js文件、实现客户端的分页控制。已经在显示页面储存了当前页码信息一个<input type='hidden'>。
引用js文件后，就可以用了，哈哈，很顺利。

复制代码代码如下:

// JScript 文件
function Init()
{
$.get("Handler.ashx", function (tablestr) {
document.getElementById('Content').innerHTML=tablestr;
document.getElementById('currPageIndex').value='1';
});
}
function InitNext()
{
VAR currIndex=document.getElementById('currPageIndex').value;
var nextIndex=Number(currIndex)+1;
$.get("NextHandler.ashx",{index:currIndex},function (tablestr) {
document.getElementById('Content').innerHTML=tablestr;
document.getElementById('pageInfo').innerText="当前第 "+nextIndex+" 页";
document.getElementById('currPageIndex').value=nextIndex;
});
}
function InitUp()
{
var currIndex=document.getElementById('currPageIndex').value;
var nextIndex=Number(currIndex)-1;
$.get("PreviousHandler.ashx",{index:currIndex},function (tablestr) {
document.getElementById('Content').innerHTML=tablestr;
document.getElementById('pageInfo').innerText="当前第 "+nextIndex+" 页";
document.getElementById('currPageIndex').value=nextIndex;
});
}

将它引用到显示页面

复制代码代码如下:

搞定！
剩下的就是服务端了，这个就简单了，咱就是c#代码出身，直接呼啦呼啦.....
1、第一页初始化的数据。....

复制代码代码如下:

<%@ WebHandler Language="C#" Class="Handler" %>
using System;
using System.Web;
using System.Data;
using System.Text;
public class Handler : IHttpHandler {
public void PRocessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
DataSet ds = HebHX.DBUtility.DbHelperSQL.Query("select top 20 cust_code,cust_name,cust_addr,bank_name,bank_account From customer_info");
StringBuilder tb = new StringBuilder("<table class='dateGrid'><tr><th style＝'width:130px'>税号</th><th style＝'width:150px'>企业名称</th><th style＝'width:200px'>企业地址</th><th style＝'width:150px'>银行</th><th style＝'width:150px'>银行账号</th><tr>");
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
tb.Append("<tr>");
for (int j = 0; j < ds.Tables[0].Columns.Count; j++)
{
tb.Append("<td class='Item'>");
tb.Append(ds.Tables[0].Rows[i][j].ToString());
tb.Append("</td>");
}
tb.Append("</tr>");
}
tb.Append("</table>");
context.Response.Write(tb.ToString());
}
public bool IsReusable {
get {
return false;
}
}
}

2、点击下一页用到的 .ashx文件。

复制代码代码如下:

<%@ WebHandler Language="C#" Class="NextHandler" %>
using System;
using System.Web;
using System.Data;
using System.Text;
public class NextHandler : IHttpHandler {
public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
int pageRows = 20;
int pageIndex = Convert.ToInt32(context.Request.Params["index"]) + 1;
DataSet ds = HebHX.DBUtility.DbHelperSQL.Query("select top " + pageRows.ToString() + " cust_code,cust_name,cust_addr,bank_name,bank_account from customer_info where cust_id> (select max(t.cust_id) from (select top " + (pageRows * pageIndex).ToString() + " cust_id from customer_info order by cust_id) t) order by cust_id");
StringBuilder tb = new StringBuilder("<table class='dateGrid'><tr><th style＝'width:130px'>税号</th><th style＝'width:150px'>企业名称</th><th style＝'width:200px'>企业地址</th><th style＝'width:150px'>银行</th><th style＝'width:150px'>银行账号</th><tr>");
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
tb.Append("<tr>");
for (int j = 0; j < ds.Tables[0].Columns.Count; j++)
{
tb.Append("<td class='Item'>");
tb.Append(ds.Tables[0].Rows[i][j].ToString());
tb.Append("</td>");
}
tb.Append("</tr>");
}
tb.Append("</table>");
context.Response.Write(tb.ToString());
}
public bool IsReusable {
get {
return false;
}
}
}

3、点击前一页用到的.ashx文件。有思路了这个就更简单了，直接就是copy了。

复制代码代码如下:

 
<%@ WebHandler Language="C#" Class="UpHandler" %> 
using System; 
using System.Web; 
using System.Data; 
using System.Text; 
public class UpHandler : IHttpHandler { 
public void ProcessRequest (HttpContext context) { 
context.Response.ContentType = "text/plain"; 
int pageRows = 20; 
int pageIndex = Convert.ToInt32(context.Request.Params["index"]) - 1; 
DataSet ds = HebHX.DBUtility.DbHelperSQL.Query("select top " + pageRows.ToString() + " cust_code,cust_name,cust_addr,bank_name,bank_account from customer_info where cust_id> (select max(t.cust_id) from (select top " + (pageRows * pageIndex).ToString() + " cust_id from customer_info order by cust_id) t) order by cust_id"); 
StringBuilder tb = new StringBuilder("<table class='dateGrid'><tr><th style＝'width:130px'>税号</th><th style＝'width:150px'>企业名称</th><th style＝'width:200px'>企业地址</th><th style＝'width:150px'>银行</th><th style＝'width:150px'>银行账号</th><tr>"); 
for (int i = 0; i < ds.Tables[0].Rows.Count; i++) 
{ 
tb.Append("<tr>"); 
for (int j = 0; j < ds.Tables[0].Columns.Count; j++) 
{ 
tb.Append("<td class='Item'>"); 
tb.Append(ds.Tables[0].Rows[i][j].ToString()); 
tb.Append("</td>"); 
} 
tb.Append("</tr>"); 
} 
tb.Append("</table>"); 
context.Response.Write(tb.ToString()); 
} 
public bool IsReusable { 
get { 
return false; 
} 
} 
} 