Ajax传递数据有两种一种是xml格式另外一种是json格式的。数据量比较少所以我选择用json格式
注意：如果你设置了请求的格式为"json"，此时你没有设置Response回来的ContentType 为：context.Response.ContentType = "text/plain";那么你将无法捕捉到返回的数据。
1.创建一个一般处理程序（或者是aspx.cs）
private int pageRow;//每页显示条数
private int pageCount;//总条数
public void ProcessRequest (HttpContext context) {
pageRow = 10;
context.Response.ContentType = "text/plain";
//得到页索引
int pageIndex=Convert.ToInt32( context.Request.Form["pageIndex"].ToString());
//数据总条数
string strSqlCount = "select count(userId) from t_electronTrading_userall";
pageCount=Convert.ToInt32(DataAccess.ExecuteScalar(false, strSqlCount, null).ToString());
string strSql = "select top 10 userId,username from t_electronTrading_userall where userId not in(select top " + (pageIndex * pageRow).ToString() + " userId from t_electronTrading_userall order by userId)order by userId";
SqlDataReader reader = DataAccess.ExecuteReader(false, strSql, null);
System.Text.StringBuilder sb = new System.Text.StringBuilder();
sb.Append("{\"UserInfo\":[");
while (reader.Read())
{
sb.Append("{");
sb.Append("\"userId\":\"" + reader["userId"].ToString() + "\",");
sb.Append("\"userName\":\"" + reader["username"].ToString() + "\"");
sb.Append("},");
}
sb.Remove(sb.Length - 1, 1);
sb.Append("],");
//页信息
sb.Append("\"PageInfo\":[{\"pageCount\":"+pageCount.ToString()+",\"pageRow\":"+pageRow+"}]");
sb.Append("}");
context.Response.Write(sb.ToString());
}
2、创建页面aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="AjaxPage.aspx.cs" Inherits="Ajax_AjaxPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Ajax + .net 的数据分页</title>
<script src="../js/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
/*--------------------分页------------------------*/
var pageIndex=1;
var pageRow;
var count=0;
var pageCount;//总页数
var strPage="";
/*---------得到后台数据并显示------------*/
function getData(index)
{
$.ajax({
url:"PageHandler.ashx",
data:{pageIndex:index-1},
dataType:"json",
type:"post",
beforeSend:function(){
//清空 table
$("#datas").html("");
//添加表头
$("#datas").append("<tr><th>用户ID</th><th>用户名</th></tr>");
},
success:function(data,status){
//页索引
pageIndex=index;
//总条数
count= $(data)[0].PageInfo[0].pageCount;
//每页显示条数
pageRow=$(data)[0].PageInfo[0].pageRow;
//总页数
pageCount=Math.ceil(count/pageRow);
//读取后台获取的json对象
for(var x=0;x<$(data)[0].UserInfo.length;x++)
{
var userId= $(data)[0].UserInfo[x].userId;
var userName= $(data)[0].UserInfo[x].userName;
//填充到表格
$("#datas").append("<tr><td>"+userId+"</td><td>"+userName+"</td></tr>");
}
},
complete:function(){
//生成分页字符
createPage();
},
error:function(e){
alert("加载数据error");
}
});
}
/*-----------生成分页字符-------------*/
function createPage()
{
//页码大于最大页数
if(pageIndex>=pageCount)
{
pageIndex=pageCount;
}
//页码小于1
if(pageIndex<1){
pageIndex=1;
}
strPage="<tr style='font-size:12px'><td colspan='2'><span style='float:left'>共"+count+"条，第"+pageIndex+"/"+pageCount+"页</span>";
//第一页
if(pageIndex==1)
{
strPage+="<span style='float:left;border:1px solid #ededed;'>首页 上一页</span>";
}
//大于一页
else
{
strPage+="<span style='float:left;border:1px solid #ededed;width:50px;'><a href='#' href='#' οnclick='getData(1)'>首页</a></span><span style='float:left;border:1px solid #ededed;width:50px;'><a href='#' href='#' οnclick='getData("+(pageIndex-1)+")'>上一页</a></span>";
}
//最后一页
if(pageIndex>=pageCount)
{
strPage+="<span style='float:left;border:1px solid #ededed;width:100px;'>下一页 末页</span>";
}
//小于最后一页 大于第一页
else
{
strPage+="<span style='float:left;border:1px solid #ededed;width:50px;' ><a href='#' οnclick='getData("+(pageIndex+1)+")'>下一页</a></span><span style='float:left;border:1px solid #ededed;width:50px;'><a href='#' οnclick='getData("+pageCount+")'>末页</a></span>";
}
strPage+="</td></tr>";
$("#datas").append(strPage);
}
</script>
</head>
<body οnlοad="getData(1)">
<form id="form1" runat="server">
<div id="tb_User">
<table id="datas" border="1" cellspacing="0" style="border-collapse: collapse">
</table>
</div>
</form>
</body>
</html>
扫一扫
289
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
