C#中分页技术比较多,但是利用javascript来实现高效分页的比较少,现在详细介绍如下。
效果图:
首先建立存储过程:
alter PROCEDURE [dbo].Pr_GetSpecialRequestListPage
@pageindex INT, --页面索引
@pagesize INT --页面大小
AS
create table #tmpsort0([id] int identity(1,1),KeyField int)
INSERT INTO #tmpsort0
SELECT top 50 [id]
FROM chathisconnect where comment <> ''
ORDER BY [id] desc
create table #tmpsort([sortid] int identity(1,1),KeyField int)
INSERT INTO #tmpsort
SELECT [KeyField] FROM #tmpsort0
ORDER BY [KeyField] ASC
DROP TABLE #tmpsort0
/*分页临时表*/
DECLARE @PageLowerBound INT
DECLARE @PageUpperBound INT
DECLARE @MaxPage INT
DECLARE @RecordCount INT
select @RecordCount =COUNT(sortid) from #tmpsort
set @MaxPage=(@RecordCount-1)/@pagesize+1
if @pageindex>@MaxPage
set @pageindex=@MaxPage
set @PageLowerBound=(@pageindex-1)*@pagesize
set @PageUpperBound=@PageLowerBound+@pagesize
/*查询结果*/
SELECT a.character,a.comment
FROM chathisconnect AS a,#tmpsort AS t
WHERE a.[id]=t.KeyField and t.sortid>@PageLowerBound and t.sortid<=@PageUpperBound
ORDER BY t.sortid ASC
select @pagesize as PageSize,@RecordCount as RecordCount,@pageindex as PageIndex,@MaxPage as PageCount
/*删除临时表*/
DROP TABLE #tmpsort
javascript详细代码:
<script type="text/javascript">
var pageindex=1;
var pagesize=10;
doSpecial();
function doSpecial()
{
chat.ajax.specialrequest.GetSpecialRequestListPage(pageindex,pagesize,doSpecialRequest_CallBack);//ajax调用返回的dataset数据
}
function doSpecialRequest_CallBack(response)
{
var ds=response.value;
if(ds==null) { alert("请求失败,请稍候重试!"); }
var str="";
var dt=ds.Tables[0];
for(var i=0;i<dt.Rows.length;i++)
{
str=str+ "by " + dt.Rows[i].character + "<br/>\r\n";
str=str+ "" + dt.Rows[i].comment + "<br/>\r\n";
str=str+"<hr size=1 style=\"color: blue;border-style:dotted;width:530\">";
}
str=str+"<div class='turnPage'>"+ pagestr( ds.Tables[1] ) + "</div>";
$("divmorespecialrequest").innerHTML=str;
}
function goPage(pagenum)
{
pageindex=pagenum;
doSpecial();
}
function pagestr(dt)
{
var str="";
pagesize=parseInt(dt.Rows[0].PageSize);
var recordcount=parseInt(dt.Rows[0].RecordCount);
pageindex=parseInt(dt.Rows[0].PageIndex);
var pagecount=parseInt(dt.Rows[0].PageCount);
var startpage=parseInt((pageindex-1)/10)*10+1;
var endpage=startpage+9;
endpage=endpage>pagecount?pagecount:endpage;
if(pagecount>1)
{
str=str+"一共<strong>"+recordcount+"</strong>条记录,<strong>"+pageindex+"</strong>/"+pagecount+"页 ";
str=str+"<a href=\"javascript:goPage(1);\"><strong>首页</strong></a> ";
if(pageindex>1)
{
t=parseInt(pageindex)-1;
str=str+"<a href=\"javascript:goPage("+t+");\"><strong>上一页</strong></a> ";
}
for(i=startpage;i<=endpage;i++)
{
if(pageindex==i)
{
str=str+"[<strong>"+i+"</strong>] ";
}
else
{
str=str+"[<a href=\"javascript:goPage("+i+");\">"+i+"</a>] ";
}
}
if(pageindex<pagecount)
{
t=pageindex+1;
str=str+"<a href=\"#\" onclick=\"goPage("+t+");\"><strong>下一页</strong></a> ";
}
str=str+"<a href=\"javascript:goPage("+pagecount+");\"><strong>尾页</strong></a>";
}
return str;
}
</script>
C#(asp.net)中利用javascript实现高效分页技术详细代码讲解完毕,有不懂的可以到技术社区(bbs.25yi.com)进行提问。欢迎共同探讨网站设计技术。